word-break

テキスト・フォント

単語の改行方法を制御するプロパティです。長い単語やURLの処理に便利です。

構文

Syntax
word-break: normal | break-all | keep-all | break-word

コード例

1

word-break: break-all;
実行結果
verylongwordwithoutspaces

任意の文字で改行(英数字も含む)

2

word-break: keep-all;
実行結果
単語を分割せずに改行

単語を分割せずに改行

3

.url { word-break: break-all; overflow-wrap: break-word; }
実行結果
https://very-long-url-example.com/path

長いURLの改行処理

💡 TIPS

日本語サイトではkeep-all、英語サイトではbreak-wordが一般的。

関連プロパティ

ブラウザサポート

IE5.5+, 全モダンブラウザ