CSS3中提供了一種可以同時(shí)添加多個(gè)陰影效果的方法，通過box-shadow屬性，我們可以為一個(gè)元素添加多個(gè)陰影效果。

下面我們來看一個(gè)例子：

.box-shadow-demo {
width: 200px;
height: 200px;
background-color: #ddd;
border: 1px solid #ccc;
box-shadow: 10px 10px 10px #888, -10px -10px 10px #ccc, 10px -10px 10px #aaa;
}

上述代碼中，我們?yōu)橐粋€(gè).box-shadow-demo的元素添加了三個(gè)陰影效果，它們分別是：

• 右下方 10px 10px 的大小，顏色為 #888 的陰影
• 左上方 -10px -10px 的大小，顏色為 #ccc 的陰影
• 右上方 10px -10px 的大小，顏色為 #aaa 的陰影

box-shadow 屬性支持多個(gè)值，每個(gè)值之間使用逗號(hào)隔開，每個(gè)值表示一個(gè)陰影效果。

每個(gè)陰影效果的參數(shù)含義分別為：

• 水平偏移量（必須，可以為正、負(fù)值）
• 垂直偏移量（必須，可以為正、負(fù)值）
• 模糊半徑（可選，不能為負(fù)值）
• 擴(kuò)展半徑（可選，不能為負(fù)值）
• 顏色值（可選，默認(rèn)為黑色）

除了 box-shadow 屬性之外，還有一種可以實(shí)現(xiàn)多個(gè)陰影效果的屬性是 text-shadow，它的使用方法與 box-shadow 類似。

多個(gè)陰影效果的添加為網(wǎng)頁(yè)設(shè)計(jì)帶來了更多的選擇和變化，開發(fā)者可以結(jié)合實(shí)際需求使用，創(chuàng)造出更加豐富多彩的頁(yè)面效果。