CSS实现图像旋转动态效果
in 编程技术 with 1 comment
CSS实现图像旋转动态效果
in 编程技术 with 1 comment

例如向一个名为img01的类选择器添加旋转样式,在animation属性内设置,旋转动画,rotate为动画名(自定义的名称),6s为周期,linear为线性渐变(取消渐变效果),infinite为无限循环,即每轮动画结束后自动进入下一轮,实现无限旋转效果。

.img01{  
    display: block;
    animation: rotate 6s linear infinite;
}  
@keyframes rotate{
    0%{
        transform: rotateZ(0deg);/*从0度开始*/
    }
    100%{
        transform: rotateZ(360deg);/*360度结束*/
    }
}
Responses
  1. Your writing has a way of resonating with me on a deep level. I appreciate the honesty and authenticity you bring to every post. Thank you for sharing your journey with us.

    Reply