|
楼主 |
发表于 2019-4-13 23:23:36
|
显示全部楼层
另一个
源代码:
- <div id="container">
- <div id="photo">
- <img src="1.png" />
- <img src="2.png" />
- <img src="3.png" />
- </div>
复制代码
css:
- #container {
- width: 400px;
- height: 300px;
- overflow: hidden;
- }
-
- #photo {
- width: 1200px;
- animation: switch 5s ease-out infinite;
- }
-
- #photo > img {
- float: left;
- width: 400px;
- height: 300px;
- }
-
- @keyframes switch {
- 0%, 25% {
- margin-left: 0;
- }
- 35%, 60% {
- margin-left: -400px;
- }
- 70%, 100% {
- margin-left: -800px;
- }
复制代码
|
|