CSS繪制三角符號是前端開發中常用的技巧之一，可以讓頁面更加美觀而且簡潔。下面我們來看看如何使用CSS繪制三角符號。

<style>
.triangle-up {
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid black;
}
</style>
<div class="triangle-up"></div>

上面的代碼中，我們定義了一個類名為“triangle-up”的div元素，它的寬和高都為0，并且使用了border屬性繪制了一個黑色的下三角。

<style>
.triangle-down {
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid black;
}
</style>
<div class="triangle-down"></div>

下面我們再來看看如何繪制一個黑色的上三角，代碼如下：

<style>
.triangle-left {
width: 0;
height: 0;
border-top: 10px solid transparent;
border-right: 10px solid black;
border-bottom: 10px solid transparent;
}
</style>
<div class="triangle-left"></div>

上面的代碼中，我們定義了一個類名為“triangle-left”的div元素，它的寬和高都為0，并且使用了border屬性繪制了一個黑色的左三角。

<style>
.triangle-right {
width: 0;
height: 0;
border-top: 10px solid transparent;
border-left: 10px solid black;
border-bottom: 10px solid transparent;
}
</style>
<div class="triangle-right"></div>

最后，我們再來看看如何繪制一個黑色的右三角，代碼如下：

這就是CSS繪制三角符號的方法，通過簡單的CSS屬性繪制，可以讓頁面更加美觀。