css 动画 @keyframes

最新推荐文章于 2023-09-13 13:46:29 发布

blogscsdn

最新推荐文章于 2023-09-13 13:46:29 发布

阅读量517

点赞数

本文链接：https://blog.csdn.net/blogscsdn/article/details/52218174

版权

动画命名：

-webkit-animation:slide1 3s ease-out infinite;

创建动画是通过逐步改变从一个CSS样式设定到另一个。

指定的变化时发生时使用％，或关键字"from"和"to"，这是和0％到100％相同。

<span style="font-size:18px;">@-webkit-keyframes slide1 {
  0% { margin-left:0;}
  23% { margin-left:0;}
  33% { margin-left:-600px;}
  56% { margin-left:-600px;}
  66% { margin-left:-1200px;}
  90% { margin-left:-1200px;}
  100% {margin-left:0;}
}</span>