純CSS三角形是用CSS編寫的一個圖形效果，可以使用CSS中的偽元素屬性來實現(xiàn)。在以下示例中，我們將演示如何使用CSS和HTML代碼創(chuàng)建不同類型的三角形。

/* 向下三角形 */
.triangle-down {
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-top: 50px solid #333;
}
/* 向上三角形 */
.triangle-up {
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: 50px solid #333;
}
/* 向左三角形 */
.triangle-left {
width: 0;
height: 0;
border-top: 50px solid transparent;
border-right: 50px solid #333;
border-bottom: 50px solid transparent;
}
/* 向右三角形 */
.triangle-right {
width: 0;
height: 0;
border-top: 50px solid transparent;
border-left: 50px solid #333;
border-bottom: 50px solid transparent;
}

在這些示例中，我們使用了border屬性并將其中至少一個邊框的值設(shè)置為0，其中50px的值可以根據(jù)需要進(jìn)行更改。還需要根據(jù)所需方向調(diào)整邊框的位置以確保正確呈現(xiàn)所需的三角形。

使用純CSS創(chuàng)建圖形效果是前端開發(fā)中一個很有用的技巧，可以節(jié)省HTML文件大小并減少服務(wù)器的負(fù)擔(dān)。如果您想要掌握CSS技巧，請務(wù)必多加練習(xí)并參考CSS文檔。