CSS是網頁設計中不可或缺的一部分，其可以實現各種形狀的界面元素。本文將介紹如何使用CSS實現帶邊框的梯形。

.trapezoid {
width: 200px;
height: 0;
border-bottom: 50px solid blue;
border-left: 100px solid transparent;
border-right: 100px solid transparent;
}

上述樣式代碼中，我們使用了一個偽類元素來制造梯形。通過設置一個固定寬度和高度為0，然后利用CSS邊框的特性來構建一個梯形邊框。

其中border-bottom表示底邊的粗細、樣式和顏色，border-left和border-right則表示左右兩側斜邊的粗細、顏色和樣式。使用transparent設置的邊框，其實是透明邊框，是為了讓梯形的兩側部分不出現不必要的背景色。

最后在頁面中調用類名為trapezoid的元素，就可以看到我們實現的帶邊框的梯形。