<wbr> - 単語の区切り

トップ > HTMLリファレンス > <wbr>

概要

形式
<wbr>
サポート
LS / H5 / e2 / Ch1 / Sa4 / Op11.7 / N2
カテゴリ
フローコンテンツ
フレージングコンテンツ
親要素
フレージングコンテンツ を子要素に持てるもの
子要素
無し(Empty)
タグの省略
開始タグ:必須 / 終了タグ:無し
属性
グローバル属性

説明

wbr は Word BReak の略です。行の中で「改行してもよい箇所」を示します。

wbr は最初 Netscape Navigator でサポートされました。<nobr> とあわせて使用され、<nobr> によって改行が禁止されたテキストでも <wbr> が挿入された箇所だけは改行が許可されます。

wbr はその後、IE など他のブラウザに採用されました。HTML4.01 には採用されませんでしたが、HTML5 でサポートされました。ただし、HTML5 でも <nobr> は採用されていません。

改行制御に関わるスタイルシートには white-spaceline-breakword-break などがあります。

属性

グローバル属性
詳細は グローバル属性 を参照してください。

wbrの使用例 - 長い英単語を改行する

下記の様に長い英単語を適度に改行する場合に用います。

HTML
塵肺症のことを英語で、
Pneumono<wbr>ultra<wbr>micro<wbr>scopic<wbr>silico<wbr>volcano<wbr>coni<wbr>osis
といいます。

横幅の狭いブラウザでは、下記の例の様に表示されます。

表示
塵肺症のことを英語で、Pneumonoultramicroscopicsilico
volcanoconiosis といいます。

パス名やURLを改行する

例えば、パス名やURLの途中で改行されないことにより、文章の右側に空白が空いてしまう場合、

表示
HTML5に関する概要は
http://ja.wikipedia.org/wiki/HTML5 を参照して
ください。

wiki の前に <wbr> を挿入することで、下記の様に表示することが可能となります。

表示
HTML5に関する概要は http://ja.wikipedia.org/
wiki/HTML5 を参照してください。

ソフトハイフンによる改行制御

<wbr> と似たものにソフトハイフンという特殊文字があります。ソフトハイフンを挿入した箇所では長い単語の途中であっても改行が許され、改行された場合はハイフン(またはハイフンに似た記号)が表示されます。ソフトハイフンは、Unicode では U+00AD、HTML4.01 では、文字参照の &shy; や &#173; に割り当てられています。HTML5 には &shy; や &#173; の記載はありませんが、Unicode(U+00AD)は使用可能です。

HTML
塵肺症のことを英語で、
Pneumono&shy;ultra&shy;micro&shy;scopic&shy;silico&shy;volcano&shy;coni&shy;osis
といいます。

ソフトハイフンをサポートするブラウザでは、例えば次のように表示されます。

表示
塵肺症のことを英語で、Pneumonoultramicroscopicsilico-
volcanoconiosis といいます。

関連項目

<nobr><br>

リンク


Copyright (C) 1996-2017 杜甫々
初版:1996年9月10日 最終更新:2017年12月31日
http://www.tohoho-web.com/html/wbr.htm