前回文字を縦書きにする方法の記事を書きましたが今回は文字の方向を変える方法について書きたいと思います!!
文字の方向を変える
文字の方向を変えるのって普通のWebサイトには基本使わないと思うんですけどデザインとかアクセントとして使いたい場面を多いと思います。
けど前書いた縦書きと同じなんですけどわからなくて画像として貼り付けてしまう人も多いのではないでしょうか。
これもcssで簡単にできてしまいます!!
文字の方向を変える方法はtext-orientationを使います!
デフォルトではmixedになっていて英数字は横、和文は縦に表示されます。
英数字を縦に表示したいならupright、和文を横に表示したいときはsidewaysと指定しましょう。
See the Pen Untitled by kenta66448284 (@kenta66448284) on CodePen.
なんかcodepenだとうまく行かないんですけどコピペして試してもらえばテキストの方向が変わるはずです!!
今回はテキストの方向を変える方法を書きました!!
サイトにちょっとしたアクセントがほしいときに試してみたらどうでしょうか!!