CSS3动画旋转——（图片360°旋转）

今天在重构网页特效的时候，想着用到一个css3的旋转特效。简单来一个demo。

html

<div class="box">
    <img src="./yft.png" alt="" class="rotation">
  </div>

css

<style>
    @-webkit-keyframes rot {
      from {
        -webkit-transform: rotate(0deg);
      }
      to {
        -webkit-transform: rotate(360deg);
      }
    }
    .rotation {
      animation: rot 3s linear infinite;
    }
  </style>

注意的是，建议这里使用的是插入图片，如果用背景图片的话，那么盒子内的内容也会进行旋转。