三角形是CSS邊框的常見裝飾，無論是作為箭頭指示方向，還是作為裝飾線條，都可以通過CSS實現。下面介紹兩種常見的三角形實現方法。

/* 方法1：邊框 + 透明 */
.triangle1 {
width: 0;
height: 0;
border-top: 20px solid transparent;
border-right: 20px solid #f00; /* 三角形顏色 */
}

該方法利用CSS的邊框屬性，通過給某一邊框設定較大的寬度，同時另一邊框設定為透明的方式實現。效果如下：

/* 方法2：偽元素 + 邊框 */
.triangle2 {
position: relative;
width: 0;
height: 0;
}
.triangle2::before {
content: "";
position: absolute;
top: 0;
left: 0;
border-top: 20px solid #f00; /* 三角形顏色 */
border-right: 20px solid transparent;
}

該方法則是利用CSS的偽元素（::before和::after）和定位的方式實現。詳細的解釋可以參考這篇文章。效果如下：