CSS實(shí)現(xiàn)文字豎排

在CSS中，我們可以使用writing-mode屬性來(lái)實(shí)現(xiàn)文字的豎排，writing-mode屬性定義了文本在元素中的排列方式，可以選擇橫向或縱向排列。

以下是一個(gè)簡(jiǎn)單的例子，展示如何使用CSS將文字豎排：

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

.vertical-text {
  writing-mode: vertical-rl; /* 縱向排列，從右到左 */
  transform: rotate(180deg); /* 旋轉(zhuǎn)180度，使文字從下到上排列 */
}

在上面的例子中，我們定義了一個(gè)名為.vertical-text的類，用于將文字豎排，我們?cè)O(shè)置writing-mode屬性為vertical-rl，表示文字縱向排列，從右到左，我們使用transform屬性將文字旋轉(zhuǎn)180度，使文字從下到上排列。

需要注意的是，writing-mode屬性只在支持CSS3或更高版本的瀏覽器中使用，在使用時(shí)，請(qǐng)確保您的瀏覽器支持該屬性。

除了writing-mode屬性外，我們還可以使用其他CSS屬性來(lái)調(diào)整文字的豎排效果，如text-align、line-height等，這些屬性可以幫助我們更好地控制文字的排列和樣式。

使用CSS實(shí)現(xiàn)文字豎排是一種簡(jiǎn)單而實(shí)用的方法，通過(guò)調(diào)整writing-mode、transform等屬性，我們可以輕松地實(shí)現(xiàn)各種豎排效果。