在網頁設計中，下拉箭頭是一個非常常見的設計元素。在CSS中，我們可以使用:before或:after偽元素，通過偽元素實現下拉箭頭。下面是CSS實現下拉箭頭的代碼：

.arrow-down {
position: relative;
}
.arrow-down:before {
content: "";
display: block;
border: 8px solid transparent;
border-top-color: #333;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

首先，我們給一個含有下拉箭頭的HTML元素添加一個class名為"arrow-down"：

<div class="arrow-down"></div>

然后，在CSS中，我們設置該元素的position屬性為relative，以便我們在其內部用:before或:after偽元素創建一個border top顏色為#333的三角形，同時設置偽元素的position屬性為absolute，使其絕對定位，top和left屬性均為50%并使用translate()方法使其在元素的中心位置，如下所示：

.arrow-down:before {
content: "";
display: block;
border: 8px solid transparent;
border-top-color: #333;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

最終實現效果如下：