例
讓轉化子元素保留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