CSS 字體垂直排版 CSS 可以幫助我們控制文本的樣式和位置。在這篇文章中，我們將討論如何使用 CSS 實現字體垂直排版。 首先，讓我們看一下垂直排版的一些基礎概念。字體的垂直排版是指讓文本沿著豎直方向排列，通常用于東亞文字。在 CSS 中，我們可以通過指定字體的 writing-mode 屬性實現垂直排版。 writing-mode 屬性 writing-mode 屬性允許我們指定文本的書寫方向和文本流方向。默認值為 horizontal-tb，水平方向從左到右。如果我們要把文本垂直排列，可以將 writing-mode 屬性設置為 vertical-rl 或 vertical-lr。 例如，下面是一個 HTML 文本塊，其中包含了一些中文漢字和英文字母。

這是一段中文文本
This is an English text

如果我們希望這段文本垂直排列，可以使用以下 CSS 代碼。

p {
writing-mode: vertical-rl;
text-orientation: mixed;
}

text-orientation 屬性 text-orientation 屬性用于定義文本在 writing-mode 方向上的方向。通常，中文的垂直排版是從上到下，英文的垂直排版是從下到上。我們可以使用 text-orientation 屬性控制文本的排列方向。 例如，我們可以使用以下 CSS 代碼將中文文本從上到下垂直排列，英文文本從下到上垂直排列。

p {
writing-mode: vertical-rl;
text-orientation: mixed;
}
p:first-child {
text-orientation: upright;
}
p:last-child {
text-orientation: sideways;
}

注意，text-orientation 屬性的值在不同瀏覽器中可能有所不同。在一些瀏覽器中，例如 Chrome 和 Safari，upright 值和 sideways 值并不支持。 總結 在 CSS 中，我們可以使用 writing-mode 屬性和 text-orientation 屬性實現字體的垂直排版。writing-mode 屬性用于定義文本的書寫方向和文本流方向，可以設置為 vertical-rl 或 vertical-lr。text-orientation 屬性用于定義文本在 writing-mode 方向上的方向，可以設置為 upright、sideways 或 mixed。