CSS3中怎樣為文本疊加單個或多個陰影效果?
ext-shadow是CSS3新增屬性，該屬性可以為頁面中的文本添加陰影效果。text-shadow屬性的基本語法格式如下：
選擇器{text-shadow:h-shadow v-shadow blur color;}
在上面的語法格式中，h-shadow用于設置水平陰影的距離，v-shadow用于設置垂直陰影的p距離，blur用于設置模糊半徑，color用于設置陰影顏色。
下面通過一個案例來演示text-shadow屬性的用法，如例所示。
example.html
<!doctype html><html><head><meta charset="utf-8"><title>text-shadow屬性</title><style type="text/css">P{ ?font-size: 50px; ?text-shadow:10px 10px 10px red; /*設置文字陰影的距離、模糊半徑和顏色*/}</style></head><body><p>Hello CSS3</p></body></html>
上述代碼中，第9行代碼用于為文字添加陰影效果，設置陰影的水平和垂直偏移距離為10px，模糊半徑為10px，陰影顏色為紅色。
運行代碼效果如下圖所示：
可以看出，文本右下方出現了模糊的紅色陰影效果。此外，當設置陰影的水平距離參數或垂直距離參數為負值時，可以改變陰影的投射方向。
注意：
陰影的水平或垂直距離參數可以設為負值，但陰影的模糊半徑參數只能設置為正值，并且數值越大陰影向外模糊的范圍也就越大。
設置多個陰影疊加效果
我們可以使用text-shadow屬性給文字添加多個陰影，從而產生陰影疊加的效果。設置陰影疊加的方法非常簡單，我們只需設置多組陰影參數，中間用逗號隔開即可，例如，想要對段落設置紅色和綠色陰影疊加的效果，可以將p標簽的樣式更改為：
P{
?font-size:32px;
?text-shadow:10px 10px 10px red,20px 20px 20px green; /*紅色和綠色的投影疊加*/
}
在上面的代碼中，為文本依次指定了紅色和綠色的陰影效果，并設置了陰影的位置和模糊數值。陰影疊加效果如圖所示。
