在網頁設計和開發中，我們經常需要用到各種形狀的圖形來美化頁面，其中三角形可以作為一個很好的輔助元素來提高頁面的可視性。在本文中，我們將介紹如何使用CSS編寫三角形。 1. 用border實現三角形 我們可以使用CSS的border屬性來制作三角形。具體方法是在一個元素上設置一個寬度為0的邊框，然后將其它邊框設置為透明。這樣就可以制作出一個三角形了。例如：

p {
border: 30px solid transparent;
border-bottom-color: #f00;
}

上述代碼將創建一個底邊長為60px，高為0的三角形，同時這個三角形的底邊的顏色為紅色。 2. 用偽元素::before和::after制作三角形 我們還可以使用CSS的偽元素(::before和::after)來創建三角形。具體的代碼如下：

p {
position: relative;
width: 0;
height: 0;
border-left: 30px solid transparent;
border-right: 30px solid transparent;
border-bottom: 30px solid #f00;
}
p::before {
content: "";
position: absolute;
left: -30px;
top: 30px;
width: 0;
height: 0;
border-left: 30px solid transparent;
border-right: 30px solid transparent;
border-top: 30px solid #f00;
}

通過在一個元素上設置偽元素::before和::after，并在偽元素中設置樣式屬性，就可以制作出一個三角形。上述代碼將在一個P標簽內部創建一個高度為30px，底邊長為60px的三角形，同時這個三角形的底邊的顏色為紅色。 總結： 通過上述兩種方法，我們可以使用CSS快速輕松的制作出各種三角形，同時還可以控制三角形的大小、顏色和方向。其中比較靈活的方法是使用偽元素來創建三角形，可以制作出更加復雜的圖形。