下面這篇教程是教你如何用css3來製作3d效果的文字，文章翻譯自3d css shadow text tutorial。
這個簡單的css文字陰影教程將一步步教你如何通過堆疊多層陰影來建立3d文字，然後進一步利用css3的transform和transition屬性來實現滑鼠移過字型放大的效果。請注意，這個3d文字效果是用純css的，沒有用j**ascript，並且需要用支援css3的瀏覽器才能看出效果，如firefox、chrome、safari和opera。
css文字陰影是如何實現的
為了實現3d的文字效果，我們將會利用css3的text-shadow屬性，text-shadow的工作原理如下：
複製**
**如下:
.example-class
譯者注：x表示x軸上的位移，可為負值；y表示y軸上的程式設計客棧位移，可為負值；blur表示投影的寬度，不能為負值；color為投影的顏色。
堆疊多層css投影
雖然我們沒有必要堆疊多層投影，但通過堆疊多層投影會有更好的3d效果
開始建立3d文字
你可能會選擇比文字更深的顏色來作為投影的顏色，所以這個例子中我就用白色的文字，用深一點的灰色作為投影顏色，這個例子中我將h2的文字渲染3d效果，css**如下：
複製**
**如下:
h2 效果如下：
好了，到這裡你已經建立了基本的3d文字，然而，讓我們進一步來實現滑鼠滑過的文字放大效果，並用css的transision屬性實現圓滑的淡入淡出效果。
首先用transform屬性實現滑過字型放大
複製**
**如下:
h2:hover
效果如下：
然後利用transition屬性實現淡入淡出效果
複製**
**如下:
h2 到此，我們就用css3實現了3d效果的文字，並且在滑鼠滑過是讓字型放大，且有淡入淡出的效果，這一切是用純css實現的哦。
下面是這個例子的demo，一起看看
d css text
with 『zoom』
本文標題: 如何利用css3製作3d效果文字具體實現樣式
本文位址: /web/css/80475.html
CSS3實現3D立體效果
css3實現3d效果 1.涉及到的幾個css3屬性 首先大家需要了解transform屬性，主要有平移 translate 縮放 scale 拉伸 skew 旋轉 rotate 這裡涉及到3d轉換的主要介紹旋轉。下面通過一組rotate效果直觀理解rotatex,rotatey,rotatez區別。...
CSS3實現3D盒子效果
近日，看到了css3中，設計動態立體盒子的例子，覺得比較新奇，所以研究了下，加以自己的拙見，設計了如圖所示的例子，拿來給大家分享 此圖為firefox下的截圖 這跟 3d盒子 的實現方式一樣，我的盒子也是以它為原型來設計的。整個盒子的html結構很簡單，如下 後下 左前上右 一，盒子定位 首先初始化...
純CSS3製作骰子3D旋轉動畫效果
閒暇之餘看了一些關於css3的3d動畫方面的文章，自己寫了乙個3d骰子旋轉動畫效果，分享給大家。先直接上效果圖 1.首先建立乙個容器 divclass stage divclass club divclass front div divclass back div divclass left div...