<!DOCTYPE html>
<head>
<title>Document</title>
<style>
* {
margin: 0;
padding: 0;
}
.box {
position: relative;
width: 500px;
height: 280px;
border: 1px solid #999;
margin: 0px auto;
/* 溢出隐藏 */
overflow: hidden;
}
img {
float: left;
width: 500px;
height: 280px;
/* 保证和父盒子一样大 */
}
.box1 {
width: 1000px;
height: 280px;
animation: lunb 5s infinite linear;
/* 用来存放图片 */
}
@keyframes lunb {
25% {
margin-left: -500px;
}
50% {
margin-left: -500px;
}
75% {
margin-left: 0px;
}
100% {
margin-left: 0px;
}
}
</style>
</head>
<body>
./img/QQ图片20190929224239.png"alt="">
./img/QQ图片20190924182524.jpg"alt="">
</div>
</div>
</body>
</html>
