CSS是一種非常強大的樣式表語言，可以用它來設置網頁的樣式。本文將介紹如何使用CSS來寫出上下三角形，讓網頁看起來更加美觀。

.triangle {
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
}
.triangle-up {
border-bottom: 50px solid #f00;
}
.triangle-down {
border-top: 50px solid #f00;
}

首先，我們需要定義一個class為“triangle”的元素，設置其寬度為0，高度為0，并且設置其邊框為透明。

然后，我們可以通過設置“triangle-up”或“triangle-down”的class來確定它是上三角形還是下三角形（假設我們想要紅色的三角形，顏色可以根據需要進行更改）。對于上三角形，我們需要設置其底部的邊框為50px寬度的紅色（#f00）；對于下三角形，我們需要設置其頂部的邊框為50px寬度的紅色（#f00）。

這樣，我們就完成了上下三角形的CSS樣式設置。可以通過以下HTML代碼演示：

<div class="triangle triangle-up"></div>
<div class="triangle triangle-down"></div>

以上HTML代碼會產生一個紅色的上三角形和一個紅色的下三角形。

綜上所述，通過設置透明的邊框，我們可以非常簡單地創建出上下三角形的樣式。這種方法不僅簡單易用，而且可以很容易地進行修改和定制，滿足不同的網頁設計需求。