使用CSS3创建3D文本效果

HTML部分：

<p class=”threeD”>The Third Dimension</p>

CSS部分:

深度效果使用多层text-shadow，使用offset和blur产生偏移效果。

1. p.threeD
2. {
3.     text-shadow:
4.         -1px 1px 0 #ddd,
5.         -2px 2px 0 #c8c8c8,
6.         -3px 3px 0 #ccc,
7.         -4px 4px 0 #b8b8b8,
8.         -4px 4px 0 #bbb,
9.         0px 1px 1px rgba(0,0,0,.4),
10.         0px 2px 2px rgba(0,0,0,.3),
11.         -1px 3px 3px rgba(0,0,0,.2),
12.         -1px 5px 5px rgba(0,0,0,.1),
13.         -2px 8px 8px rgba(0,0,0,.1),
14.         -2px 13px 13px rgba(0,0,0,.1)
15.         ;
16. }

在Firefox, Chrome, Safari or Opera下效果不错，但IE中只有IE10才有这个效果！

效果页面：http://blogs.sitepointstatic.com/examples/tech/css3-3d-text/index.html