word-spacing
word-spacing は CSS のプロパティで、タグ間や単語間の間隔を設定します。
対応ブラウザ
| 機能 | デスクトップ | モバイル | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 1 | 12 | 1 | 1 | 18 | 1 | |
normal | 1 | 12 | 1 | 1 | 18 | 1 |
| その他 | ||||||
| word-spacing 属性は、単語間の間隔の動作を指定します。 | 1 | 12 | 1 | 1 | 18 | 1 |
基本構文
CSS
.wide-spacing {
word-spacing: 0.3em;
}
.tight-spacing {
word-spacing: -0.05em;
} ライブデモ
実務での使いどころ
-
見出しの単語間隔調整
大きなフォントサイズの見出しで単語間のスペースを微調整し、バランスの取れたタイポグラフィを実現します。
注意点
- 過度な word-spacing は可読性を著しく損なうため、em単位で小さな調整値を使用してください。
アクセシビリティ
- 単語間隔の変更はディスレクシアのあるユーザーの読みやすさに影響する場合があるため、極端な値は避けてください。