div {  /*IE10以下支持哈*/  /*定义动画完成一个周期所需要的时间，以秒或毫秒计*/  -webkit-animation-duration: 5s;   /*绑定规则名字*/  -webkit-animation-name: move;  /*规定播放次数 无限次*/  -webkit-animation-iteration-count: infinite;   /*定义是否应该轮流反向播放动画*/  -webkit-animation-direction: alternate;  width: 200px;  height: 200px;  margin: 100px;  background-color: #808080; /*性能优化，尽量让动画元素脱离文档流，以减少重排*/  position: absolute;}/*css3动画  @keyframes 规则*//*制定规则为move的动画*/@-webkit-keyframes move{    from {        left: 100px;    }    to {        left: 200px;    }}/*这里的@keyframes规则中left会额外触发layout和paint   应该优化为transform形式  transform只会触发composite*/@-webkit-keyframes move{    from {        -webkit-transform: translateX(100px);    }    to {        -webkit-transform: translateX(200px);    }}/*相应兼容性修改-webkit前缀即可*/