CSS是一種常見的web開發語言，很多人都使用它來布局和美化網頁。除了基本的布局和樣式之外，CSS還可以用來創建各種形狀的圖形，比如三角形。在這篇文章中，我們將探討如何使用CSS繪制一個帶有邊框的三角形。

.triangle {
width: 0;
height: 0;
border-top: 50px solid #ccc;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: none;
}

上面的代碼使用CSS的border屬性創建了一個帶有邊框的三角形。首先，我們設置寬度和高度為0，這是為了確保我們只繪制三角形的三個邊框。接下來，我們使用border-top和border-left/right屬性來指定三角形的三個邊框的樣式。在這個例子中，我們使用50像素的邊框上下邊框，以及透明的左右邊框來創建三角形的形狀。最后，我們使用border-bottom:none屬性來確保沒有底部邊框。

如果您想要添加填充到三角形，只需添加padding屬性即可：

.triangle {
width: 0;
height: 0;
border-top: 50px solid #ccc;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: none;
padding: 20px;
}

可以根據需要調整三角形的大小和顏色。另外，您還可以使用CSS3的transform屬性來旋轉三角形以及其他更高級的樣式效果。希望這篇文章對您有所幫助，讓您了解如何使用CSS繪制帶有邊框的三角形。