こんにちはレターズです。茨城県水戸市を拠点に日々ホームページを考える人です。
今回は、地味に分かりずらいwhite-space, line-break….関連のcssのざっくりとした違い早見表です。備忘録に良さげです。
| プロパティ | 目的 | 最適な使用例 |
|---|---|---|
white-space | スペースと改行を制御 | 余分なスペースを防止 |
line-break | 改行しない単語を処理 | 日本語/中国語のテキストの改行 |
overflow-wrap (word-wrap) | 長い単語を改行 | URL、長い文字列 |
word-break | 任意の場所で単語を改行 | 狭いレイアウト、強制改行 |
hyphens | 自動ハイフネーション | ジャスティファイされたテキストの段落 |
text-wrap | スマートなテキストラッピング | レスポンシブな見出し |
