CSSで単語の間隔を指定する方法

  • ガイド ( How to )
  • ありがとう数:0

はじめに

Photo by ぽたる
CSSで単語の間隔を指定する方法をガイドします。

STEP1■単語間の感覚を指定しない場合

word-spacing:normal;

STEP2■pxで指定する場合

word-spacing:(数値)px;

上のタグの(数値)のところに指定したい数値を入力します。

【例】
単語と単語の間隔を10pxにしたい場合は
word-spacing:10px; と指定します。

STEP3■emで指定する場合

word-spacing:(数値)em;

こちらも数値で指定する方法ですが、pxでの指定ではなく、emでの指定です。
emというのは文字を基準にして指定する方法で 1em=1文字です。

【例】
単語と単語の間隔を1文字分にしたい場合は
letter-spacing:1em; と指定します

STEP4

■letter-spacing と word-spacing の違い

letter-spacingは文字と文字の間の間隔を指定
word-spacingは単語と単語の間の感覚を指定 します。

【例】
letter-spacing:1em;  G O T H I S W A Y
word-spacing:1em; GO THIS WAY

まとめ

Illustrationby 著者

このユーザなら私の疑問や悩みを解決してくれそうと思ったら、
質問への回答をリクエストすることができます。

特集


感謝でトクする時代へ!感謝経済に参加しよう!

ピックアップ

ページ先頭へ