CSS3中Transform动画属性用法详解

2020-05-11 18:31:42易采站长站整理

            height: 100px;    
            width: 100px;    
            border: 1px dashed red;   
            display: inline-block;   
        }  
        #div1 div{   
            height: 100px;   
            width: 100px;    
            background: #63F7ED;    
            transform:rotateX(45deg);       /* W3C标准 */  
            -webkit-transform:rotateX(45deg)); /* Safari 和 Chrome */  
        }  
        #div2{margin-left: 50px;}  
        #div2 div{   
            height: 100px;   
            width: 100px;    
            background: #63F7ED;    
            transform:rotateY(45deg);       /* W3C标准 */  
            -webkit-transform:rotateY(45deg)); /* Safari 和 Chrome */  
        }  
        #div3{margin-left: 50px;}  
        #div3 div{   
            height: 100px;   
            width: 100px;    
            background: #63F7ED;    
            transform:rotateZ(45deg);       /* W3C标准 */  
            -webkit-transform:rotateZ(45deg)); /* Safari 和 Chrome */