CSS樣式表的一項重要功能是可以讓我們控制HTML文檔中各種元素的樣式。其中，在顯示文字時垂直方向的排列方式就是一個常見的問題。下面，我們介紹一些CSS代碼，可以讓文字垂直顯示在頁面中。 首先，讓我們看一下最基本的CSS文本垂直居中的語法： ``` .vertical-align-middle { display: flex; align-items: center; justify-content: center; } ``` 這段代碼使用了CSS中的彈性盒模型（Flexbox）來實現文字的垂直排列。通過將元素標記為display: flex，我們就可以在水平方向靈活地放置各個元素。align-items: center屬性是指在垂直方向上將元素居中，并且justify-content: center屬性將元素在水平方向上居中。 接下來，我們可以利用另一種方法來實現文本的垂直排列： ``` .vertical-align-middle { position: relative; top: 50%; transform: translateY(-50%); } ``` 這種方法使用了CSS的相對定位（position: relative）和垂直偏移（top: 50%）。由于50%的偏移是相對于父元素的高度來計算的，所以文字的垂直居中位置就可以得到。接著，我們使用transform: translateY(-50%)屬性將文字上移50%的高度，這樣就完成了垂直居中的操作。 最后，我們也可以使用文字行高的方法，來實現文本的垂直居中： ``` .vertical-align-middle { display: table-cell; vertical-align: middle; height: 100px; line-height: 100px; } ``` 這段代碼的關鍵就是使用了display: table-cell屬性，這樣可以將元素標記為表格單元格。接著，我們可以應用垂直居中的樣式，使用vertical-align: middle，結合高度和行高來實現。 總之，以上是一些常見的CSS方法，可以讓我們實現文本在垂直方向上的排列。可以根據實際需求選擇不同的方法。