line-break
CJKテキスト(日本語・中国語・韓国語)における改行ルールの厳密さを制御するプロパティです。禁則処理の強さをloose、normal、strictから選択でき、行頭・行末に配置できない文字のルールを調整します。日本語組版における適切な禁則処理の実装に重要な役割を果たします。
概要
CJKテキスト(日本語・中国語・韓国語)における改行ルールの厳密さを制御するプロパティです。禁則処理の強さをloose、normal、strictから選択でき、行頭・行末に配置できない文字のルールを調整します。日本語組版における適切な禁則処理の実装に重要な役割を果たします。
対応ブラウザ
デスクトップ
Chrome 83+
Edge 83+
Safari 13+
Firefox 69+
モバイル
Chrome Android 83+
Safari iOS 13+
Firefox Android 79+
基本構文
CSS
.loose {
line-break: loose;
}
.strict {
line-break: strict;
} 実務での使いどころ
-
日本語テキストの禁則処理設定
新聞風のレイアウトではloose、書籍風のレイアウトではstrictを設定し、コンテンツの性質に合った改行ルールを適用します。
注意点
- strictモードでは改行位置が制限されるため、狭いコンテナでは文字がはみ出す場合があります。overflow-wrapと組み合わせて使用してください。
アクセシビリティ
- 適切な禁則処理は日本語テキストの可読性に大きく影響するため、ターゲットユーザーの読みやすさを優先して設定してください。