可以通过设置css属性改变标签的移动位置,旋转,缩放比例,倾斜度数。
transform 是一个符合属性,一个标签的属性不可以出现两个transform。可以发他们的值写在一些。
移动的方向是:
水平左正,右负。
垂直方向,上负,下正。
首先显示transform 的属性都有那些
translateX(x):平移元素沿 x 轴
translateY(y):平移元素沿 y 轴
translate(x, y):平移元素沿 x 和 y 轴
scaleX(x):缩放元素沿 x 轴
scaleY(y):缩放元素沿 y 轴
scale(x, y):缩放元素沿 x 和 y 轴
rotate(angle):旋转元素一个角度
rotateX(angle):沿 x 轴旋转元素
rotateY(angle):沿 y 轴旋转元素
rotateZ(angle):沿 z 轴旋转元素
skewX(angle):倾斜元素沿 x 轴
skewY(angle):倾斜元素沿 y 轴
skew(angle);默认原点倾斜
1:translate 移动位置
用到的是
transform: translate(200px,100px); 表示向左移动200px,向下移动100px.
transform: translate(200px);也可以是一个值,表示向左移动200px.
transform: translate(100%); translate里的值也可以是百分比。
移动的距离是参考自身,如果自身宽度是200px,那么100%就是200px,同时高度也是同样的道理。
translateX() 表示的就是向水平方向可以作用移动。
translateY() 表示的是垂直方向移动。