css3旋轉(zhuǎn)如何應(yīng)用？
CSS3已經(jīng)出現(xiàn)很多年了，而且應(yīng)用也極為廣泛。尤其是移動(dòng)互聯(lián)網(wǎng)時(shí)代，越來越多的網(wǎng)站采用了CSS3進(jìn)行樣式編碼。CSS3有非常多的技術(shù)特性，比如旋轉(zhuǎn)、陰影、亮度、飽和度、圓角、等等。正好筆者在寫一個(gè)有關(guān)網(wǎng)頁元素旋轉(zhuǎn)的布局，那么，下面就討論一下CSS3旋轉(zhuǎn)角度。
先看代碼：
div
{
transform:rotate(7deg);
-ms-transform:rotate(7deg); /* IE 9 */
-moz-transform:rotate(7deg); /* Firefox */
-webkit-transform:rotate(7deg); /* Safari 和 Chrome */
-o-transform:rotate(7deg); /* Opera */
}
上面的7deg的意思就是旋轉(zhuǎn)7度，非常簡單。
CSS3旋轉(zhuǎn)角度的代碼看上去很多，實(shí)際上核心部在于transform:rotate(7deg);。但是，為了適用于各類瀏覽器，筆者還是建議你不要怕麻煩把這些代碼都寫上吧，畢竟用戶體驗(yàn)第一。
為什么要用CSS3旋轉(zhuǎn)角度功能呢？上圖是筆者正在開發(fā)的一套酒店智能控制系統(tǒng)，其中空調(diào)溫度控制功能中的儀表盤就用到了CSS3旋轉(zhuǎn)角度功能。通過觸摸儀表盤旋轉(zhuǎn)達(dá)到控制空調(diào)溫度的目的，而儀表盤的旋轉(zhuǎn)就必須要用到CSS3的旋轉(zhuǎn)角度功能。這樣，應(yīng)該是一目了然了。
