CSS 圖片旋轉功能,減少art出圖

有些前端工程師很喜歡叫art出圖,連旋轉其實都是可以用css做到,

但卻懶到什麼都叫art來做,造成art很討厭工程師 XDDD !

CSS的 transform 屬性可以讓網頁元素變形,呈現多種的特殊效果,其中之一便是旋轉效果,可以自由設定元素順時針或逆時針旋轉幾度。

寫法為rotate(θ)
指定元素以參考點為中心軸旋轉θ度。
θ 參數須有標示單位,例如: deg (角度)、rad (弧度) 、grad (梯度)
正數為順時針旋轉,負數反之為逆時針。

幾行簡單的程式碼就搞定,也可以不用讓art,還要開photoshop 調整角度,等等差一度又要再重新出圖。

 

Reference

https://www.webdesigns.com.tw/css_rotate.asp

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *