纯CSS风车动画

一款纯CSS风车动画效果，月朗星稀的背景，风车自动旋转片刻的稍作停顿，宁静湖面的倒影，简直是充满诗意的特效啊（美美的表情）...

分类：css3 > transform 难易：初级

查看演示下载资源下载积分： 20 积分

关注公众号，免费赠送安装视频教程、环境和学习视频，后面会不断更新。

页面的head部分，需引入页面文件的样式文件，代码如下：

<link type="text/css" rel="stylesheet" href="css/style.css">

页面的body部分，需设置好多个元素的div容器，代码如下：

<div id="Circle">
   <div id="cont">
      <div class="top">
         <div class="dome"></div>
         <div class="fan">
            <div class="fan_blade1"></div>
            <div class="fan_blade2"></div>
            <div class="fan_blade3"></div>
            <div class="fan_blade4"></div>
         </div>
         <div class="mill"></div>
         <div class="sky">
            <div class="tailstar"></div>
               <div class="stars"></div>
               <div class="moon"></div>
            </div>
         <div class="floor">
            <span class="tree1"></span>
            <span class="tree2"></span>
            <span class="tree3"></span>
         </div>
      </div>
      <div class="bottom">
         <div class="dome"></div>
         <div class="fan">
            <div class="fan_blade1"></div>
            <div class="fan_blade2"></div>
            <div class="fan_blade3"></div>
            <div class="fan_blade4"></div>
         </div>
         <div class="mill"></div>
         <div class="sky">
               <div class="stars"></div>
               <div class="moon"></div>
            </div>
         <div class="floor">
            <span class="tree1"></span>
            <span class="tree2"></span>
            <span class="tree3"></span>
         </div>>
      </div>
   </div>
</div>