CSS變形是CSS3中的一個(gè)重要特性,它能夠改變?cè)氐男螤睢⒋笮 ⑽恢谩⒎较颉⑼该鞫鹊葘傩裕⑶铱梢詫?shí)現(xiàn)一些非常炫酷的效果。在CSS變形中,我們常用的屬性包括:
transform: translate(x, y); // 平移 transform: rotate(angle); // 旋轉(zhuǎn) transform: scale(x[, y]); // 縮放 transform: skew(angleX, angleY); // 傾斜 transform: matrix(a, b, c, d, tx, ty) // 矩陣變形
值得注意的是,translate屬性能夠改變?cè)氐奈恢茫挥绊懫渌膶傩裕?strong>rotate屬性能夠?qū)崿F(xiàn)元素的旋轉(zhuǎn)效果,旋轉(zhuǎn)中心默認(rèn)在元素的中心點(diǎn);scale屬性能夠?qū)崿F(xiàn)元素的縮放效果,可以同時(shí)指定x軸和y軸方向的縮放比例;skew屬性能夠?qū)崿F(xiàn)元素的斜切效果,可以同時(shí)指定x軸和y軸方向的斜切角度;matrix屬性可以實(shí)現(xiàn)任意的變換效果,但需要指定一個(gè)復(fù)雜的6個(gè)參數(shù)的矩陣。
以上就是CSS變形中最常用的屬性,掌握這些屬性可以讓我們輕松實(shí)現(xiàn)更加豐富多彩的頁(yè)面效果。