line-break

スタイルシート属性 line-break は、行末の禁則処理を指定します。

禁則処理とは、行の先頭に来ることが望ましくない文字が、行の先頭に来ないように改行位置を調整することです。通常、日本語の文章では句読点や拗音は行の先頭に来ることはありません。

書式

line-break: mode

属性値

mode
行末の禁則処理を指定します。
意味
normal句読点(、。)を禁則処理する(規定値)
strict句読点と拗音(っゃゅょ)を禁則処理する

対応状況

Webブラウザ対応状況
Internet Explorer 6.0
FireFox 3.0×1
Google Chrome 0.3×1
Opera 9.62×1
Safari 3.2×1

1 常に拗音(っゃゅょ)を禁則処理する。

使用例

次にスタイルシート属性 line-break を使用したHTMLの例を示します。

<p style="line-break: normal; width: 10em">あっ、いぃ、うぅ、えぇ、おぉ、つっ、やゃ、ゆゅ、よょ、あっ、いぃ、うぅ、えぇ、おぉ、つっ、やゃ、ゆゅ、よょ、あっ。いぃ。うぅ。えぇ。おぉ。つっ。やゃ。ゆゅ。よょ。あっ。いぃ。うぅ。えぇ。おぉ。つっ。やゃ。ゆゅ。よょ。</p>

あっ、いぃ、うぅ、えぇ、おぉ、つっ、やゃ、ゆゅ、よょ、あっ、いぃ、うぅ、えぇ、おぉ、つっ、やゃ、ゆゅ、よょ、あっ。いぃ。うぅ。えぇ。おぉ。つっ。やゃ。ゆゅ。よょ。あっ。いぃ。うぅ。えぇ。おぉ。つっ。やゃ。ゆゅ。よょ。

<p style="line-break: strict; width: 10em">あっ、いぃ、うぅ、えぇ、おぉ、つっ、やゃ、ゆゅ、よょ、あっ、いぃ、うぅ、えぇ、おぉ、つっ、やゃ、ゆゅ、よょ、あっ。いぃ。うぅ。えぇ。おぉ。つっ。やゃ。ゆゅ。よょ。あっ。いぃ。うぅ。えぇ。おぉ。つっ。やゃ。ゆゅ。よょ。</p>

あっ、いぃ、うぅ、えぇ、おぉ、つっ、やゃ、ゆゅ、よょ、あっ、いぃ、うぅ、えぇ、おぉ、つっ、やゃ、ゆゅ、よょ、あっ。いぃ。うぅ。えぇ。おぉ。つっ。やゃ。ゆゅ。よょ。あっ。いぃ。うぅ。えぇ。おぉ。つっ。やゃ。ゆゅ。よょ。

word-break

スタイルシート属性 word-break は、行末の改行処理を指定します。

書式

word-break: mode

属性値

mode
行末の改行処理を指定します。
意味
normal和文は単語の途中でも改行、英文は単語の切れ目で改行(規定値)
break-all単語の途中でも改行
keep-all単語の切れ目で改行

対応状況

Webブラウザ対応状況
Internet Explorer 6.0
FireFox 3.0×1
Google Chrome 0.3
Opera 9.62×1
Safari 3.2

1 常に単語の切れ目で改行する。

使用例と表示サンプル

次にスタイルシート属性 word-break を使用したHTMLの例を示します。

<p style="word-break: break-all; width: 20em">This is HTML 4.01 Strict DTD, which excludes the presentation attributes and elements that W3C expects to phase out as support for style sheets matures. Authors should use the Strict DTD when possible, but may use the Transitional DTD when support for presentation attribute and elements is required.</p>

This is HTML 4.01 Strict DTD, which excludes the presentation attributes and elements that W3C expects to phase out as support for style sheets matures. Authors should use the Strict DTD when possible, but may use the Transitional DTD when support for presentation attribute and elements is required.

<p style="word-break: keep-all; width: 20em">This is HTML 4.01 Strict DTD, which excludes the presentation attributes and elements that W3C expects to phase out as support for style sheets matures. Authors should use the Strict DTD when possible, but may use the Transitional DTD when support for presentation attribute and elements is required.</p>

This is HTML 4.01 Strict DTD, which excludes the presentation attributes and elements that W3C expects to phase out as support for style sheets matures. Authors should use the Strict DTD when possible, but may use the Transitional DTD when support for presentation attribute and elements is required.

white-space

white-spaceは、空白文字及び自動改行の扱いを指定するスタイルシート属性である。

書式

white-space: space

属性値

space
空白、タブ及び改行の扱いを次の値から指定する。
意味
normal自動改行あり、空白は詰める。(初期値)
pre自動改行なし、空白はそのまま。
nowrap自動改行なし、空白は詰める。
pre-wrap自動改行あり、空白はそのまま。
pre-line連続する空白、タブ及び改行をひとつの空白として表示する。自動改行する。
inherit上位要素のスタイルを継承する。

適用可能要素

すべての要素

対応状況

Webブラウザ対応状況
Internet Explorer 6.0
FireFox 3.0
Google Chrome 0.3
Opera 9.62
Safari 3.2

使用例

次にスタイルシート属性 white-space の使用例と表示サンプルを示す。表示結果はブラウザによって異なることがある。

<p style="white-space:pre">white    space</p>

white space

<p style="white-space:nowrap">white    space</p>

white space

<p style="white-space: pre-wrap">white space white space white space white space white space white space</p>

white space white space white space white space white space white space