設定文字為直書（包含英文單字）

【HTML】

<div class="text-vertical">

    這裡的文字呈會呈現中文的直式

</div>

【CSS語法】

• 直書從右至左
  .text-vertical {-webkit-writing-mode: vertical-rl;  writing-mode: vertical-rl;}
  
  
  
  
  
• 直書從左至右
  .text-vertical {-webkit-writing-mode: vertical-lr;  writing-mode: vertical-lr;}
  
  
  
  
  

但這時會發現，不論設定左至右、或右至左的直書，裡面如果遇到英文，就會整個跟著轉 90 度，可以加上以下語法，讓英文字也能正常直書閱讀，不會旋轉90度
  .text-vertical { text-orientation: upright; }

有沒有！有沒有！就是這麼神奇~~~ 當然有的人習慣讓英文轉 90 度以利閱讀，那麼最後的修正語法就可以不用加了