word-wrap
CSSの書き方
word-wrap:値 ;
CSSの詳細情報 | |||||
---|---|---|---|---|---|
プロパティ名 | word-wrap | 読み方 | ワード・ラップ | ||
初期値 | normal | 意味 | 単語手動改行 | ||
値 | normal/break-word | ||||
対象 | すべての要素 | ||||
CSSレベル | IE独自 | 対応ブラウザ | Windows | MAC | |
継承 | する | IE 5.0以上 | SF |
解説
文章中の途中で英単語の改行をするかどうかを指定するスタイルシートです。
IE独自のプロパティですが、Safariも対応しています。
ただし、一部の値で両ブラウザの挙動が異なります。
break-wordの場合
「word-wrap」プロパティの値に「break-word」を指定した場合の挙動ですが、両ブラウザとも要素内に英単語が収まりきらない場合は単語の途中で改行されます。
normalの場合
一方、「word-wrap」プロパティの値に「normal」を指定した場合は、InternetExplorerでは要素内に英単語が収まりきらない場合は改行できる部分まで要素の幅が伸びて、単語と単語の間で改行されます。
また、Safariでは、要素に英単語が収まりきらない場合でも、要素は拡大せず、収まらない部分は要素からはみ出して表示されます。(overflowプロパティに依存)
CSS/HTMLサンプル
p { word-wrap:break-word; }
段落要素の英単語は途中で改行するよう指定 サンプル