效果：
http://hovertree.com/texiao/css/9.htm
代碼如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CSS3 3D镂空文字特效樣式 - 何問起</title><base target="_blank" />
<link rel="stylesheet" href="http://hovertree.com/texiao/css/9/normalize.css">
<link rel="stylesheet" href="http://hovertree.com/texiao/css/9/textHovertree.css" media="screen" type="text/css" />
<style>
a {
color: red;
}
.hvtholder {
width: 789px;
margin: 10px auto;
}
body{color:white}
</style>
</head>
<body>
<div class="textHovertree">3d 文字<br />何問起 hovertree.com</div>
<div class="hvtholder">您可以選中文字試試
<a href="http://hovertree.com/hvtart/bjae/fy1rvbf7.htm">原文</a> <a href="http://hovertree.com/menu/css/">CSS</a>
<a href="http://hovertree.com">首頁</a> <a href="http://hovertree.com/texiao/">特效</a>
</div>
</body>
</html>
其中的textHovertree.css代碼如下:
body {
background: #252527;
}
.textHovertree {
text-align: center;
-webkit-text-stroke: 2px white;
position: relative;
text-transform: uppercase;
color: #252527;
font-size: 8vw;
letter-spacing: 1.2vw;
font-weight: 700;
text-shadow: 0 1px 0 #4a4a4e, -1px -1px 0 #4a4a4e, /*main 3d shadow*/ -1px 0px 0 #343437, -2px 1px 0 #343437, -3px 2px 0 #313134, -4px 3px 0 #2f2f31, -5px 4px 0 #2c2c2f, -6px 5px 0 #2a2a2c, -7px 6px 0 #27272a, -8px 7px 0 #252527, -9px 8px 0 #232324, -10px 9px 0 #202022, -11px 10px 0 #1e1e1f, -12px 11px 0 #1b1b1d, -13px 12px 0 #19191a, -14px 13px 0 #161617, -15px 14px 0 #141415, -16px 15px 0 #111112, /*top right*/ 0 -1px 1px #ffffff, 0 -2px 0px #ffffff, /*bottom left corner*/ -15px 14px 0px #ffffff, -16px 15px 0px #ffffff, -17px 16px 0px #ffffff, -18px 17px 0px #ffffff, -2px -1px 0 #ffffff, -3px 0px 0 #ffffff, /*top left corner*/ -19px 15px 0 #ffffff, -18px 14px 0 #ffffff, -17px 13px 0 #ffffff, -16px 12px 0 #ffffff, -15px 11px 0 #ffffff, -14px 10px 0 #ffffff, -13px 9px 0 #ffffff, -12px 8px 0 #ffffff, -11px 7px 0 #ffffff, -10px 6px 0 #ffffff, -9px 5px 0 #ffffff, -8px 4px 0 #ffffff, -7px 3px 0 #ffffff, -6px 2px 0 #ffffff, -5px 1px 0 #ffffff, -4px 0px 0 #ffffff, /*lower right / (upper right side for capital T like H etc letters. */ 0px 2px 0px #ffffff, -1px 3px 0px #ffffff, -2px 4px 0px #ffffff, -3px 5px 0px #ffffff, -4px 6px 0px #ffffff, -5px 7px 0px #ffffff, -6px 8px 0px #ffffff, -7px 9px 0px #ffffff, -8px 10px 0px #ffffff, -9px 11px 0px #ffffff, -10px 12px 0px #ffffff, -11px 13px 0px #ffffff, -12px 14px 0px #ffffff, -13px 15px 0px #ffffff, -14px 16px 0px #ffffff, -15px 17px 0px #ffffff;
}