在CSS3中,我們可以使用transform
屬性來實現(xiàn)元素的旋轉(zhuǎn),如果你想將一個元素旋轉(zhuǎn)90度,你可以使用以下代碼:
.rotate-90 { transform: rotate(90deg); }
上述代碼會將應(yīng)用了這個樣式的元素旋轉(zhuǎn)90度,你可以根據(jù)需要應(yīng)用到不同的元素上,如果你想要旋轉(zhuǎn)一個圖片,你可以這樣寫:
<img class="rotate-90" src="your-image-source.jpg" />
這樣,圖片就會旋轉(zhuǎn)90度,注意,rotate
函數(shù)中的角度可以是負數(shù),表示逆時針旋轉(zhuǎn),也可以是正數(shù),表示順時針旋轉(zhuǎn),角度的單位可以是deg
(度)或者rad
(弧度)。
transform
屬性還有其他多種用法,比如縮放、傾斜等,都非常方便,但是需要注意的是,這個屬性在IE9以下的版本中不支持,因此在使用時需要謹(jǐn)慎考慮兼容性。
版權(quán)聲明:除非特別標(biāo)注,否則均為本站原創(chuàng)文章,轉(zhuǎn)載時請以鏈接形式注明文章出處。