css3 中是通過transform-style樣式屬性來實現 3d 立體效果的，為父元素設定了該屬性其子元素就會具有 3d 效果，對應的屬性值如下：
舉個例子：
實現乙個正方體效果：
主要是通過父元素的四條邊和前後面來構成正方體的六個面，再結合transform-style
、平移和旋轉等方法就可以實現。
css:
*
/* 父元素 */
.box
.box:hover
.box div
/* 上 */
.top
/* 下 */
.bottom
/* 左 */
.left
/* 右 */
.right
/* 前 */
.front
/* 後 */
.back
html:
class
="box"
>
class
="top"
>
上div
>
class
="bottom"
>
下div
>
class
="left"
>
左div
>
class
="right"
>
右div
>
class
="front"
>
前div
>
class
="back"
>
後div
css3 3D轉換以及動畫效果
不要給我說什麼底層原理 框架核心！老夫敲 就是一把梭！複製！貼上！拿起鍵盤就是幹！哈哈o o 通過乙個小小的demo學會css3新特性，實在不行那就複製貼上把。首先在了解3d效果之前必須先知道2d的的屬性，因為3d效果是在二維變換的基礎上增加了z軸從而達到3d效果。transform 有4個常用的方...
css3 3d翻轉效果
3d變換 perspective 透視，視角 屬性定義 3d 元素距檢視的距離，以畫素計。該屬性允許您改變 3d 元素檢視 3d 元素的檢視。決定了你所看到的是2d transform 還是3d transform 視距 perspective 和translatez 視距就是眼睛距離物體原本位置的...
css3 3D文字效果
text shadow x offset y offset blur size color x代表x軸上的位移，y代表y軸上的位移，可為負值 blur表示投影的寬度，不能為負值 color為投影的顏色 多重投影 text shadow wei astyle head body div id wei ...