CSS下邊框和陰影效果是網頁設計中常見的樣式效果，它們可以使網頁元素更加立體感和美觀。下面我們來了解一下如何使用CSS實現這兩種效果。

/* 實現下邊框效果 */
.border{
border-bottom: 1px solid #ccc;
}
/* 實現陰影效果 */
.shadow{
box-shadow: 0 2px 3px rgba(0,0,0,0.3);
}

首先我們來實現下邊框效果。我們可以使用CSS中的border-bottom屬性來為元素設置下邊框，其中solid值表示實線，#ccc表示邊框顏色，1px表示邊框寬度。我們可以將上述代碼應用于相應的類名，如應用于一個class為border的元素：

<div class="border">這是一個帶下邊框的元素</div>

這樣我們就成功為這個元素添加了下邊框效果。

接下來我們來實現陰影效果。我們可以使用CSS中的box-shadow屬性來為元素添加陰影效果，其中第一個值0表示水平偏移量，第二個值2px表示垂直偏移量，第三個值3px表示陰影擴散半徑，rgba(0,0,0,0.3)表示陰影顏色和透明度。同樣，我們可以將上述代碼應用于相應的類名，如應用于一個class為shadow的元素：

<div class="shadow">這是一個帶陰影效果的元素</div>

這樣我們就成功為這個元素添加了陰影效果。

下邊框和陰影效果都是常用的樣式效果，通過CSS我們可以很方便地實現它們。