CSS3給邊框加陰影是一種非常流行的裝飾效果，它能夠為網頁添加一些立體感和深度感。本文將介紹如何使用CSS3的box-shadow屬性為邊框添加陰影效果。

.box {
width: 300px;
height: 200px;
border: 1px solid #ccc;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

box-shadow屬性可以接受多個值，第一個值是水平偏移量，第二個值是垂直偏移量，第三個值是陰影模糊半徑，第四個值是陰影顏色。在上面的例子中，陰影所偏移的距離都是0，也就是說陰影將會固定在邊框的四周，陰影的模糊半徑為10px，顏色為rgba(0, 0, 0, 0.5)，也就是半透明的黑色。

.box {
width: 300px;
height: 200px;
border: 1px solid #ccc;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5), 0 0 20px rgba(0, 0, 0, 0.5);
}

如果想要為邊框添加多層陰影，只需要在box-shadow屬性中添加多組值即可。在上面的例子中，我們為邊框添加了兩層陰影，第一層的模糊半徑為10px，第二層的模糊半徑為20px。

.box {
width: 300px;
height: 200px;
border: 1px solid #ccc;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5) inset;
}

如果想要使陰影在邊框內部出現，而不是在邊框外面，只需要在box-shadow屬性中添加一個關鍵字inset即可。

通過CSS3的box-shadow屬性，我們可以輕松地為邊框添加陰影效果，從而使網頁顯得更具層次感和深度感。