HTML の <wbr> 要素は、テキスト内でブラウザーが任意で改行を行ってよい位置を表します。また、この改行規則により他の場所で改行されることがなくなるでしょう。

コンテンツカテゴリ フローコンテンツ, 記述コンテンツ
許可されている内容 なし
タグの省略 この要素は空要素です。開始タグは必須であり、終了タグを記述してはなりません。
許可されている親要素 記述コンテンツを受け入れるすべての要素
許可されている ARIA ロール すべて
DOM インターフェイス HTMLElement

属性

この要素にはグローバル属性のみがあります。

メモ

UTF-8 エンコードを使用するページでは、 <wbr> 要素は U+200B ZERO-WIDTH SPACE コードポイントのように作用します。特に、この要素は Unicode bidi BN コードポイントのように作用するため、双方向性には影響を与えません。 <div dir=rtl>123,<wbr>456</div> が 2 行に分かれないときは 456,123 ではなく 123,456 と表示されます。

同じ理由で、 <wbr> 要素は改行位置でハイフンを生成しません。行末にのみハイフンを表示させるには、代わりにソフトハイフンの文字実体参照 (&shy;) を使用してください。

この要素は Internet Explorer 5.5 で最初に実装され、 HTML5 で公式に定義されました。

The Yahoo Style Guide では、句読点などの区切り文字 【訳注: URL ではスラッシュも含む】 が行末に置かれることを避けるため URL を句読点ので改行することを推奨しています。区切り文字が行末にあると、読者が URL の末尾を誤解する可能性があります。

<p>http://this<wbr>.is<wbr>.a<wbr>.really<wbr>.long<wbr>.example<wbr>.com/With<wbr>/deeper<wbr>/level<wbr>/pages<wbr>/deeper<wbr>/level<wbr>/pages<wbr>/deeper<wbr>/level<wbr>/pages<wbr>/deeper<wbr>/level<wbr>/pages<wbr>/deeper<wbr>/level<wbr>/pages</p>

仕様書

仕様書 状態 備考
HTML Living Standard
<wbr> の定義
現行の標準  
HTML5
<wbr> の定義
勧告  

ブラウザーの対応

機能ChromeEdgeFirefoxInternet ExplorerOperaSafari
基本対応1 あり15.5 — 711.64
機能Android webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
基本対応 あり あり あり4 ? ? あり

関連情報

ドキュメントのタグと貢献者

このページの貢献者: mfuji09, yuheiy, yyss, .Hiroya
最終更新者: mfuji09,