网页标题图片
<link rel="icon" href="http://s3.mogucdn.com/p2/170728/upload_0105ahki6h42ae359i9e1c937j973_1600x2250.jpg"/>
h5+c3轮播
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
section {
width: 430px;
height: 440px;
overflow: hidden;
}
a {
display: block;
width: 430px;
height: 440px;
}
section a img:nth-of-type(1) {
animation: myfirst 15s infinite;
}
@keyframes myfirst {
0% {
transform: translatey(0px);
}
25% {
transform: translatey(-445px);
}
50% {
transform: translatey(-890px);
}
75% {
transform: translatey(-445px);
}
100% {
transform: translatey(0px);
}
}
</style>
</head>
<body>
<section>
<a href="#"><img src="img/8.jpg"></a>
<a href="#"><img src="img/9.jpg"></a>
<a href="#"><img src="img/10.jpg"></a>
</section>
</body>
网友评论