CSS中的邊框效果可以讓網(wǎng)頁(yè)看起來(lái)更有立體感，而陰影效果更是讓網(wǎng)頁(yè)的整體效果提升了不少。

.shadow{
box-shadow: 5px 5px 5px #888888;
}

上面的代碼就是一個(gè)簡(jiǎn)單的陰影效果，在元素class為shadow的元素上添加了5像素的模糊黑色陰影。

.shadow{
box-shadow: 2px 2px 4px rgba(0,0,0,0.5), -2px -2px 4px rgba(255,255,255,0.5);
border: 1px solid #ccc;
}

上面代碼中除了添加了一個(gè)黑色陰影之外，還同時(shí)添加了白色陰影。同時(shí)還添加了一個(gè)邊框。上面這個(gè)代碼的效果如下圖所示：

從上面的這個(gè)效果可以看出，陰影效果確實(shí)是可以很好的讓網(wǎng)頁(yè)看起來(lái)更加立體，更加有層次感。可以說(shuō)CSS中的border和box-shadow是讓網(wǎng)頁(yè)設(shè)計(jì)變得更加生動(dòng)的重要元素。