CSS 3のtransform属性は、どのようにして複数の異なるアニメーション(変換属性)効果を同時に実行させることができますか?

1つのdom要素に複数の異なるCSS変換(transform)プロパティを同時に設定する場合、
 
アトリビュートの間をスペースで区切るだけで、スケールワープを回転させるなど同時に複数の効果を実行できます.

div{
    width: 100px; 
    height: 100px; 
    background: red; 

    
    transition: all 1s; 
} 


div:hover{

    
    transform: rotate(360deg) scale(2,2) skew(10deg,5deg);
} 

 
注意:dom要素に複数の変換transformプロパティを同時に設定した場合の実行順序!
顺番:后から前へ!!
例:
transform: rotate(360deg) scale(2,2) skew(10deg,5deg);
上の変換プロパティではskew(10 deg,5 deg)を実行してからscale(2,2)を実行し、最後にrotate(360 deg)を実行します.
だから:順番によって効果が変わる!!