CSS - 左右摇曳摆动动画(无限循环) 落日映苍穹つ 2022-12-31 04:29 105阅读 0赞 ## 效果图 ## ![在这里插入图片描述][2020122815151487.gif] ## 代码 ## @-webkit-keyframes zy{ 10% { transform: rotate(15deg); } 20% { transform: rotate(-10deg); } 30% { transform: rotate(5deg); } 40% { transform: rotate(-5deg); } 50%,100% { transform: rotate(0deg); } } /* 使用 */ .content { animation: zy 2.5s .15s linear infinite; animation: zy 2.5s .15s linear infinite; animation: zy 2.5s .15s linear infinite; animation: zy 2.5s .15s linear infinite; } /* 兼容写法 */ animation: zy 2.5s .15s linear infinite; -moz-animation: zy 2.5s .15s linear infinite; /* Firefox */ -webkit-animation: zy 2.5s .15s linear infinite; /* Safari and Chrome */ -o-animation: zy 2.5s .15s linear infinite; /* Opera */ [2020122815151487.gif]: /images/20221120/5a670ecf0dcb46c6bf6d92d34f7e153a.png
还没有评论,来说两句吧...