2D和3D转换心得

2016-07-12  本文已影响0人  _余孤_

转换

定义:改变位置、形状、尺寸{2D(XY轴)和3D(XYZ轴)}

2D:平面转换:平移(move)、倾斜(skew)、旋转(rotate)、缩放(scale)

3D:空间转换

属性:transform {2D、3D转换}

none{默认值不进行转换}

transform-function{平移缩放旋转倾斜的方式}

transform:rotate(45deg)

正值是顺时针,负值是逆时针

transform:skew(45deg)

负值是向右,正值反之,

transform:scale(0-1缩小,>1位放大)

transform:scale

(x,y)/scaleX/Y

transform-origin{默认情况:变形的中心点是元素的中心点;

写法

}

transform-style:作用:是页面以2D3D显示

Fiat:默认2D

preserve-3D:元素在3D空间展示;

特点:必须在父类元素中设置:preserve-3D;不然无法显示3D效果。

上一篇下一篇

猜你喜欢

热点阅读