word-breakプロパティ

値

次のような値を設定することができます。

• normal – 標準（ブラウザに準拠）の改行ルールを適用します。
• break-all – 単語の途中でも改行を許可します。
• keep-all – 単語の途中での改行を禁止します。CJK以外のテキストにおいては、normalと同じ標準のルールを適用します。

パターン1

ここで指定した改行方法によって、テキストの改行位置が調整されます。青い枠線がテキスト本来の幅となります。

CSSコード例

.sample_css1 .text1 {
	word-break: normal;
}
.sample_css1 .text2 {
	word-break: break-all;
}
.sample_css1 .text3 {
	word-break: keep-all;
}

normalの表示例：

break-allの表示例：

keep-allの表示例：

こちらの記事は役に立ちましたか？

コメントありがとうございます！
運営の参考にさせていただきます。