原生js添加动画效果
html
这个图片是使用阿里图标需要下载
<div class="content"><div class="contAnimation"><i class="iconfont icon-jiazai inco"></i></div></div>
css
.content{position: relative;width: 100px;height: 100px;background-color: pink;}@keyframes loading{自定义写法:/* 0%{transform: rotate(0deg);}50%{transform: rotate(120deg);}70%{transform: rotate(30deg);}100%{transform: rotate(360deg);} */传统写法:from{transform: rotate(0deg);}to{transform: rotate(360deg);}}.contAnimation{position:absolute;top: 50%;left: 50%; transform:translate(-50%,-50%);@include webkit(transform,rotate(0deg));animation:loading 1s linear infinite ; //这个是简写形式}