@keyframes move { 0% {transform: translateX(0);} 100% {transform: translateX(200px);} }
时间: 2024-05-21 08:18:15 浏览: 121
详解CSS动画属性关键帧keyframes全解析
这是一个 CSS3 的动画关键帧,定义了一个名为 move 的关键帧动画,从起始状态时元素的位置为 translateX(0),到结束状态时元素的位置为 translateX(200px)。该动画会持续一段时间,可以通过添加其他 CSS 属性来控制动画的速度和其他效果。在实际使用中,需要将该动画关键帧绑定到具体的元素上,例如:.element { animation: move 1s ease-in-out infinite; }。这样,该元素就会无限循环播放名为 move 的动画。
阅读全文