text-shadow属性定义文本阴影。
/* 文本阴影 text-shadow*/ text-shadow: length(x) length(y) length(模糊半径) color(模糊颜色); /* x,y轴偏移可以为正，可以为负，模糊半径可选，3个length的顺序不能变， color可在前可在后. 效果是可以叠加的。 */ text-shadow:1px 1px 1px red,2px 2px 2px blue;
利用多个文本阴影设置项的堆叠效果可以设计复杂的文本特效。
请看下面这些例子，第二个做了着火的效果(做的太粗，有兴趣的可以做的再细致些)，第三个为凸出效果，第四个为凹陷效果，第五个模糊边框，有点荧光的意思。
<style> p.one{ font-size:40px; text-shadow: 4px 4px 4px #600, 8px -6px 4px #060, -6px 8px 4px #006; } p.two{ color:#000; /* background: #000; */ font-size:40px; font-weight:bold; text-shadow:0 -3px 2px #ff3, 1px -5px 3px #fd3, -1px -6px 5px #f80, 1px -9px 9px #f20; } p.three{ font-size: 40px; font-weight:bold; /* background: pink; */ color:#D1D1D1; text-shadow:-1px -1px white, 1px 1px #000; } p.four{ font-size:40px; font-weight:bold; /* background: pink; */ color:#D1D1D1; text-shadow:1px 1px white, -1px -1px #000; } p.five{ font-size: 40px; font-weight:bold; color:#000; text-shadow:0 0 8px #f80, 0 0 12px #f80; } </style></head><body> <p class="one">TEXT</p> <p class="two">TEXT</p> <p class="three">TEXT</p> <p class="four">TEXT</p> <p class="five">TEXT</p></body>