好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

关于css旋转动画

我们可以通过css来做出动画效果,下面我为大家演示的是div的旋转,颜色过渡的动画

   DOCTYPE html  > 
   html   lang  ="zh-cmn-Hans"  > 
   head  > 
   meta   charset  ="utf-8"   /> 
   title  >  title  > 
   style  >  
    a  {      
        text-align  :  center  ;  
        line-height  :  100px  ;  
        transition  :  all 2s  ;  
        width  :  100px  ;  
        height  :  100px  ;  
        background  :  pink  ;  
        float  :  left  ;  
        border-radius  :  50%  ; 
     }  
    a:hover  {  
        transition  :  all 2s  ;  
        background  :  red  ;  
        transform-origin  :  50 100  ;  
        transform  :  rotate(360deg)  ;  
        border-radius  :  50%  ; 
        
     } 
   style  > 
   head  > 
   body  > 
   h1  > 请将鼠标移动到下面的矩形上:   h1  > 
   a  >  
    两秒旋转360
    a  > 
   body  > 
   html  >  

查看更多关于关于css旋转动画的详细内容...

  阅读:39次