CSS 陰影是一種在元素周圍創(chuàng)建一種類似于投影效果的視覺(jué)外觀。它可以使元素看起來(lái)更立體，更加引人注目，并且可以輕松地通過(guò)使用 CSS 屬性來(lái)實(shí)現(xiàn)。之前大家可能只能用 Photoshop 等軟件達(dá)到這種效果，但現(xiàn)在可以通過(guò)以下方法控制它。

box-shadow: h-shadow v-shadow blur spread color inset;

這里，我們有五個(gè)屬性值，分別是：

• h-shadow：水平陰影的位置。可正可負(fù)。
• v-shadow：垂直陰影的位置。可正可負(fù)。
• blur：模糊程度。
• spread：創(chuàng)建陰影的輻射范圍，可正可負(fù)。（可選）
• color：陰影顏色。（可選）
• inset：可選，如果設(shè)置為 inset，則創(chuàng)建內(nèi)陰影；否則會(huì)創(chuàng)建外陰影。

以創(chuàng)建四周陰影為例：

.shadow {
box-shadow: 2px 2px 2px 2px #ccc;
}

這個(gè)陰影屬性值為：

• h-shadow：2px
• v-shadow：2px
• blur：2px
• spread：2px
• color：#ccc
• inset：無(wú)

從而實(shí)現(xiàn)了四周的陰影效果。

CSS 陰影是一種簡(jiǎn)單而實(shí)用的視覺(jué)技巧，經(jīng)常用于網(wǎng)站設(shè)計(jì)中，如果你想讓自己的網(wǎng)站看起來(lái)更加現(xiàn)代化，可以嘗試使用這種技巧。當(dāng)然，我們?cè)谑褂盟臅r(shí)候也要注意不要過(guò)度使用，以免引起視覺(jué)上的混亂。