word-break

InternetExplorer独自のプロパティで、文章の折り返しに関する指定を行います。


ブラウザ

IE5 / IE5.5 / IE6

▲PageTop

書式

要素[.class名][#id名]{ word-break : 値; }

▲PageTop

指定できる値

値 初期値 意味
normal ○ 英語などの単語に関しては、指定された幅を超えても単語の途中で折り返されません。
bleak-all 単語や言語に関係なく、指定された幅を超えると折り返されます。
keep-all 空白や改行を除いて、単語や言語に関係なく、指定された幅を超えても折り返しをされません。

▲PageTop

サンプル

ソースコード

<html>
  <head>
    <title>サンプルコード</title>
    <style type="text/css">
      #sample1 {
        word-break : normal;
      }
      #sample2 {
        word-break : break-all;
      }
      #sample3 {
        word-break : keep-all;
      }
      #sample div {
        width : 50px;
        background-color : #cccccc;
      }
    </style>
  </head>
  <body>
    <div id="sample">
      【word-break : normal】
      <div id="sample1">
        abcdefghijklmnopqrstuvwxyzあいうえお.
      </div>
      <br>
      【word-break : break-all】
      <div id="sample2">
        abcdefghijklmnopqrstuvwxyzあいうえお.
      </div>
      <br>
      【word-break : keep-all】
      <div id="sample3">
        abcdefghijklmnopqrstuvwxyzあいうえお.
      </div>
    </div>
  </body>
</html>

表示結果

【word-break : normal】
abcdefghijklmnopqrstuvwxyzあいうえお.

【word-break : break-all】
abcdefghijklmnopqrstuvwxyzあいうえお.

【word-break : keep-all】
abcdefghijklmnopqrstuvwxyzあいうえお.

▲PageTop

関連項目

HTML

<nobr>

▲PageTop

▲