例
让转化子元素保留3D转换:
div
{
-webkit-transform: rotateY(60deg); /* Chrome, Safari, Opera */
-webkit-transform-style: preserve-3d; /* Chrome, Safari, Opera */
transform: rotateY(60deg);
transform-style: preserve-3d;
}
试一试» 定义和用法
变换风格的属性指定元素如何嵌套在三维空间中呈现。
Note:此属性必须与使用变换属性。
为了更好地理解变换样式属性, 查看演示 。
默认值: | flat |
---|---|
遗传: | no |
动画: | no. Read about animatable |
版: | CSS3 |
JavaScript语法: | object .style.transformStyle="preserve-3d" Try it |
浏览器支持
在表中的数字规定,完全支持该属性的第一个浏览器版本。
其次是-webkit-号码或-moz-指定用一个前缀工作的第一个版本。
属性 | |||||
---|---|---|---|---|---|
transform-style | 36.0 12.0 -webkit- | 11.0 | 16.0 10.0 -moz- | 9 4.0 -webkit- | 23.0 15.0 -webkit- |
CSS语法
transform-style: flat|preserve-3d|initial|inherit;
属性值
相关页面
CSS教程: CSS 2D变换
CSS教程: CSS 3D变换
HTML DOM参考: transformStyle property