CSS 三维变换
CSS 可以通过 transform 属性在二维空间或者三维空间移动、旋转、缩放和倾斜元素,本文讨论三维变换相关的函数。
CSS 可以通过 transform
属性在二维空间或者三维空间移动、旋转、缩放和倾斜元素,本文讨论三维变换相关的函数。
CSS 三维变换函数
通过 CSS transform
属性,您可以使用以下三维转换函数:
rotateX()
rotateY()
rotateZ()
rotateX()
函数
rotateX()
函数让元素绕 X 轴旋转指定的角度。
#myDiv {
transform: rotateX(150deg);
}
rotateY()
函数
rotateY()
函数让元素绕 Y 轴旋转指定的角度。
#myDiv {
transform: rotateY(150deg);
}
rotateZ()
函数
rotateZ()
函数让元素绕 Z 轴旋转指定的角度。
#myDiv {
transform: rotateZ(90deg);
}
三维变换的浏览器支持情况
表中列出了完全支持 transform
属性的第一个浏览器版本。
Property | |||||
---|---|---|---|---|---|
transform | 36.0 | 10.0 | 16.0 | 9.0 | 23.0 |