CSS邊框加陰影的方法

在CSS中，我們可以使用box-shadow屬性給邊框添加陰影。box-shadow屬性接受四個(gè)值，分別是水平陰影的位置、垂直陰影的位置、陰影的模糊半徑和陰影的顏色。

我們可以給一個(gè)元素添加右下角的外陰影，設(shè)置陰影的顏色為灰色，模糊半徑為10px，偏移量為5px，代碼如下：

.box {
  box-shadow: 5px 5px 10px gray;
}

5px 5px表示陰影在水平和垂直方向上的偏移量，10px表示陰影的模糊半徑，gray表示陰影的顏色。

除了外陰影，我們還可以添加內(nèi)陰影，內(nèi)陰影的語(yǔ)法與外陰影類似，只需要在box-shadow屬性的值前加上負(fù)號(hào)即可。

.box {
  box-shadow: -5px -5px 10px gray;
}

這段代碼會(huì)給元素添加左上角的內(nèi)陰影，陰影的顏色為灰色，模糊半徑為10px，偏移量為5px。

需要注意的是，box-shadow屬性添加的陰影不會(huì)改變?cè)氐拇笮?，只?huì)影響元素的視覺(jué)效果，多個(gè)box-shadow屬性可以連續(xù)添加，給元素添加多個(gè)陰影效果，為了保持代碼的簡(jiǎn)潔和可讀性，我們一般只給一個(gè)元素添加一個(gè)陰影效果。