在前端開發中，經常會遇到需要使用三角圖標的情況，如導航欄、下拉菜單等。而CSS提供了一種簡單的方式來實現三角形的繪制。

.triangle {
width: 0;
height: 0;
border: 10px solid transparent;
border-bottom-color: #000;
}

上面的代碼使用border屬性定義一個空白邊框，并讓其寬度和高度都為0。接下來分別用border-left、border-right和border-bottom來定義三角形的三條邊框，從而實現其形狀。

如果要繪制一個向上的三角形，只需將border-bottom-color改為透明，同時將border-top-color改為黑色。

.triangle-up {
width: 0;
height: 0;
border: 10px solid transparent;
border-top-color: #000;
}

如果要繪制一個任意角度的三角形，可以使用transform屬性來旋轉其容器。

.triangle {
width: 0;
height: 0;
border: 10px solid transparent;
border-bottom-color: #000;
transform: rotate(45deg);
}

使用上述方法，可以輕松實現各種形狀的三角圖標，使其在網頁中發揮出良好的作用。