CSS中添加邊框和陰影是實現(xiàn)頁面美化的常見方式之一。本文將介紹如何使用CSS創(chuàng)建白色邊框和灰色陰影。

/* CSS代碼開始 */
.box {
width: 200px;
height: 150px;
border: 1px solid #ffffff;
box-shadow: 2px 2px 5px #a9a9a9;
}
/* CSS代碼結(jié)束 */

首先，在HTML中創(chuàng)建一個帶有class="box"的div元素，然后在CSS中輸入以上代碼即可實現(xiàn)白色邊框和灰色陰影效果。具體解析如下：

1. 寬高設(shè)定

首先，我們設(shè)定div元素的寬為200px，高為150px。這個根據(jù)實際情況去調(diào)整即可。

.box {
width: 200px;
height: 150px;
}

2. 邊框設(shè)定

我們希望這個div元素有白色的邊框。因此，我們使用border屬性來設(shè)定邊框，值為1px，顏色為白色（#ffffff）。

.box {
border: 1px solid #ffffff;
}

3. 陰影設(shè)定

最后，我們?yōu)閐iv元素添加灰色的陰影。使用box-shadow屬性，設(shè)定水平偏移量為2px，垂直偏移量為2px，模糊度為5px，顏色為灰色（#a9a9a9）。

.box {
box-shadow: 2px 2px 5px #a9a9a9;
}

以上步驟完成后，我們就能看到帶有白色邊框和灰色陰影的div元素了。

希望這篇文章對您有所幫助，謝謝！