在 CSS 中,我們可以使用writing-mode
屬性將文字從豎排變為橫排。
/* 將文字變為橫排 */ .container { writing-mode: horizontal-tb; }
上述代碼將.container
元素中的文本內容從豎排變為了橫排,也就是我們通常所見到的日常書寫方式。
除了horizontal-tb
,CSS 還提供了其他值可以控制文字排列的方式:
/* 橫排,從右向左書寫,適合阿拉伯文等書寫方式 */ writing-mode: horizontal-rl; /* 豎排,從上向下書寫,適合中文等書寫方式 */ writing-mode: vertical-rl; /* 豎排,從下向上書寫,和 vertical-rl 相反 */ writing-mode: vertical-lr;
同時,我們還可以使用text-orientation
屬性來控制文本內容的方向,例如將文字以垂直方向向右書寫:
/* 將文字垂直排列且向右書寫 */ .container { writing-mode: vertical-rl; text-orientation: upright; }
以上就是關于 CSS 中文字如何變成橫排的相關內容,希望能對你有所幫助。