變形效果
transform:變形效果
transform屬性可以設定元素的變形效果,分成移動、縮放、旋轉、傾斜。
- 移動translate
可以利用x,y參數移動元素,預設會以元素區域的中央為基準點。
- 縮放scale()
可依照其中x,y的參數像兩個軸的方向進行倍數縮放。
- 旋轉rotate()
可依設定的角度以元素區域的中央為基準點進行順時針旋轉。
- 傾斜skew()
依照其中x,y參數像兩軸的方向進行角度傾斜,預設也是以元素中央為基準點。
轉換效果
transition-duration:播放時間,單位為秒。
transition-property:轉換屬性
transition-timing-function:轉換方法有多種選擇,包含ease, linear, ease-in, ease-out, ease-in-out
transition-delate:延遲時間
transition:播放時間 轉換屬性 轉換方法 延遲時間