在 CSS 中,我們可以使用text-orientation
屬性來(lái)設(shè)置文字的連寫(xiě)方式,即是橫向排列還是縱向排列。
默認(rèn)情況下,文字是橫向排列的。如果我們想讓文字豎向排列,可以使用text-orientation: upright;
:
p { writing-mode: vertical-rl; text-orientation: upright; }
使用以上代碼后,文字就可以豎向排列。其中,writing-mode: vertical-rl;
表示文字從右向左排列,也就是豎向從上往下排列。而text-orientation: upright;
則表示文字豎直排列。
如果想讓文字倒置排列,可以使用text-orientation: sideways;
:
p { text-orientation: sideways; }
使用以上代碼后,文字就會(huì)倒置排列。需要注意的是,當(dāng)文字被倒置時(shí),其排列的方向也會(huì)相應(yīng)改變,因此不需要再使用writing-mode
屬性。
需要注意的是,text-orientation
屬性目前只有在 Chrome 和 Safari 瀏覽器上得到了支持,在其他瀏覽器上可能會(huì)出現(xiàn)兼容性問(wèn)題,因此在實(shí)際項(xiàng)目中,需要根據(jù)實(shí)際情況選擇是否使用該屬性。