忍者ブログ

note

仕事のメモ帳。

テキスト 一行での両端揃えの方法

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

コメント

ただいまコメントを受けつけておりません。

テキスト 一行での両端揃えの方法

クラス”text-justify”をつけるとテキストが両端揃えになる。
(bootstrap4でデフォルト設定されている。)


<p class="text-justify">テキストを両端揃えする</p>

ベタコードで書くと以下のとおり。
text-justify{
  text-align: justify;
  text-justify: inter-ideograph;
}

text-justify: inter-ideograph;については以下のサイトで説明あり。

★ブラウザ別、一行での両端揃えの方法
https://qiita.com/nabe_kurage/items/ddd1659f1798217d198f

日本語のように空白文字で区切らない言語はtext-align(-last)だけだと均等にならない。
text-justify:inter-ideographをつける必要がある。
text-justifyはIEが独自での採用したもので、inter-ideograph を指定すれば日本語・中国語・韓国語の文字間隔を調整して両端揃えにしてくれるそうです。
PR

コメント

プロフィール

HN:
nono
性別:
非公開

P R