在網頁設計中，為了實現獨特的排版效果，有時我們需要將文字豎排顯示。CSS提供了相應的規則來實現這個目的。

.vertical-text{
writing-mode: vertical-lr;
text-orientation: upright;
transform: rotate(180deg);
}

上述代碼定義了一個.vertical-text類，其中包含三個CSS規則。

writing-mode: vertical-lr;定義了文本排列的方向。vertical-lr表示豎排從左到右。

text-orientation: upright;定義了文本的方向。upright表示文本保持正向而不是倒置。

transform: rotate(180deg);定義了文本的旋轉角度，這里是180度。將文本旋轉180度可以將豎排方向從下到上變成從上到下。

使用這些CSS規則，我們可以將一段普通的文本豎排顯示：

<div class="vertical-text">
<p>這是一段豎排文字</p>
</div>

上述代碼中，我們在<div>元素中應用了.vertical-text類。這樣就可以將<p>元素中的文本排列方式變成了豎排從上到下的方式。

使用CSS規則定義文字豎排，可以為網站設計帶來全新的個性化效果。但是需要注意的是，由于豎排文本的顯示方式與傳統的橫排方式有很大的差別，因此在使用時需要根據實際情況進行設計，避免影響用戶的閱讀體驗。