wbr要素

wbr要素は、改行候補を表す要素。

カテゴリー フロー・コンテンツ、フレージング・コンテンツ。
コンテキスト フレージング・コンテンツを内包できる要素内で使用できる。
コンテンツ・モデル 空。
属性 グローバル属性。
ブラウザ対応

構文

<wbr>

要点

  • wbr要素は、改行候補を表す要素である。
  • 長いテキストにおける、改行位置の候補を指定する場合に使う。

サンプルコード

<p>longText.<wbr>longText.<wbr>longText.<wbr>longText.<wbr>longText.<wbr>longText.<wbr>longText.<wbr>longText.<wbr>longText.<wbr>longText.</p>

サンプル

HTMLソースコード

<style scoped="scoped">
.sample > p {
	width: 20em;
	background-color: #00ffe7;
	padding: 20px;
	border: 1px solid gray;
	border-radius: 10px;
}
</style>
<div class="sample">
	<p><b>wbr要素なし</b><br>longText.longText.longText.longText.longText.longText.longText.longText.longText.longText.</p>
	<p><b>wbr要素あり</b><br>longText.<wbr>longText.<wbr>longText.<wbr>longText.<wbr>longText.<wbr>longText.<wbr>longText.<wbr>longText.<wbr>longText.<wbr>longText.</p>
</div>

実際の表示

wbr要素なし
longText.longText.longText.longText.longText.longText.longText.longText.longText.longText.
wbr要素あり
longText.longText.longText.longText.longText.longText.longText.longText.longText.longText.