transform 變形前端
經過 CSS3 變換,咱們可以對元素進行移動、縮放、轉動、拉長或拉伸。使用transform屬性爲元素應用變換。動畫
一、Transform:對元素進行變形。spa
二、Transition:對元素某個屬性或多個屬性的變化,進行控制(時間等),相似flash的補間動畫。但只有兩個關鍵貞。開始,結束。3d
一.CSS3 2D 轉換orm
一、2D Transform轉換屬性blog
二、Transform 方法rem
①.移動 translateflash
translate(x,y)水平方向和垂直方向同時移動(也就是X軸和Y軸同時移動)it
translateX(x)僅水平方向移動(X軸移動)io
translateY(Y)僅垂直方向移動(Y軸移動)
②.縮放 scale
scale(x,y)使元素水平方向和垂直方向同時縮放(也就是X軸和Y軸同時縮放)
scaleX(x)元素僅水平方向縮放(X軸縮放)
scaleY(y)元素僅垂直方向縮放(Y軸縮放)
③.旋轉 rotate
在一個給定度數順時針旋轉的元素。負值是容許的,這樣是元素逆時針旋轉。
④.傾斜 skew
skew(x,y)使元素在水平和垂直方向同時傾斜(X軸和Y軸同時按必定的角度值進行傾斜變形)
skewX(x)僅使元素在水平方向傾斜變形(X軸傾斜變形)
skewY(y)僅使元素在垂直方向傾斜變形(Y軸傾斜變形)
若是你們以爲個人文章寫的還不錯的話,就關注 收藏一下哦!
你們能夠一塊兒探討下前端問題呀!
rgz987