word-break プロパティ
最終更新：2026-09-13
word-break word-break プロパティ
word-break プロパティは、コンテナの境界での単語の折り返し規則を制御し、主に長い単語や URL がコンテナからあふれる問題を解決します。単語の内部で改行してよいか、および CJK（中国・日本・韓国）テキストの折り返しをどう扱うかを決定します。ユーザーが入力した長い文字列を扱う際に特に便利です。
| カテゴリ | |
|---|---|
| 初期値 | normal |
| 継承 | はい |
| 適用対象 | |
| アニメーションタイプ | |
| CSS バージョン | CSS3 |
| 状態 | 標準 |
📝 構文
word-break: normal | break-all | keep-all | break-word;⚙️ 値
| 値 | タイプ | 説明 |
|---|---|---|
normal | break-all | keep-all | break-word | キーワード | 単語の改行規則 |
▶ 例
以下のコードを編集して、プレイグラウンドでライブ結果を確認してください：
🌐 ブラウザーサポート
| ブラウザー |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| word-break | ✓ v43 | ✓ v12 | ✓ v15 | ✓ v9 | ✓ v30 |
| すべての主要ブラウザーでサポート | |||||
ヒント： break-all は任意の文字間で改行でき、URL やコードに適しています。keep-all は CJK テキストを単語単位で保持し、文字間では改行しません。
重要： break-word 値は overflow-wrap プロパティに移動しました。word-break で使っても動きますが旧構文なので、overflow-wrap: break-word を推奨します。
❓ よくある質問
Qword-break と overflow-wrap の違いは？
Aword-break は単語内部の改行規則を制御し、overflow-wrap（旧 word-wrap）は折り返せない長い単語を改行してよいかを制御します。両者はよく組み合わせられます。word-break: break-all は強制的に改行し、overflow-wrap: break-word は単語を保持することを優先します。
Q中国語テキストにはどの値を使うべきですか？
A中国語は既定の normal で十分です。漢字はもともと文字間で改行されます。中英混在で英単語を無理に分割したくない場合は keep-all を、URL や長い単語がコンテナからあふれる場合のみ break-all を使います。
Qbreak-all と break-word の違いは？
Abreak-all は任意の 2 文字間で強制的に改行し、中英を問わずコンテナの境界で直接切断します。break-word（overflow-wrap に移動）は単語を保持することを優先し、単一の超長単語が収まらない場合のみ単語内で改行します。前者は強硬で、後者は親切です。
🏷️ 関連プロパティ
💡 関連事例
📚 関連チュートリアル
