CSS参考手册
变换 | Transforms
变换风格 | transform-style
这是一种实验技术
由于该技术的规格不稳定,请查看各种浏览器的兼容性表格以查阅用法。另外请注意,随着规范的变化,实验技术的语法和行为在未来版本的浏览器中可能会发生变化。
该transform-style
CSS属性确定该元素的子元素是否被定位在3D空间中或在该元素的平面中扁平化。
如果扁平化,子元素将不能独立存在于三维空间中。
由于该属性没有被继承,因此必须为该元素的所有非叶子后代设置该属性。
/* Keyword values */
transform-style: preserve-3d;
transform-style: flat;
/* Global values */
transform-style: inherit;
transform-style: initial;
transform-style: unset;
Initial value |
flat |
---|---|
Applies to |
transformable elements |
Inherited |
no |
Media |
visual |
Computed value |
as specified |
Animation type |
discrete |
Canonical order |
the unique non-ambiguous order defined by the formal grammar |
Creates stacking context |
yes |
语法
可能值
preserve-3d
——指示元素的子元素应位于3D空间中。
flat
——表示元素的子元素位于元素本身的平面中。
形式语法
flat | preserve-3d
规范
Specification |
Status |
Comment |
---|---|---|
CSS Transforms Level 2The definition of 'transform-style' in that specification. |
Editor's Draft |
Initial definition |
浏览器兼容性
Feature |
Chrome |
Edge |
Firefox (Gecko) |
Internet Explorer |
Opera |
Safari (WebKit) |
---|---|---|---|---|---|---|
Basic support |
12-webkit |
(Yes)-webkit (Yes) |
10 (10)-moz 16 (16)1 |
No support |
15-webkit |
(Yes)-webkit |
Feature |
Android |
Edge |
Firefox Mobile (Gecko) |
IE Phone |
Opera Mobile |
Safari Mobile |
---|---|---|---|---|---|---|
Basic support |
3.0-webkit |
(Yes)-webkit (Yes) |
10.0 (10)-moz 16.0 (16)1 |
No support |
(Yes)-webkit |
(Yes)-webkit |
变换 | Transforms相关
层叠样式表( Cascading Style Sheets )是一种用来表现 HTML 或 XML 等文件样式的计算机语言。CSS 不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。