<wbr>:换行机会元素

<wbr> HTML 元素表示断字机会 - 文本中浏览器可以选择断行的位置,但其断行规则不会在该位置创建断行。

¥The <wbr> HTML element represents a word break opportunity—a position within text where the browser may optionally break a line, though its line-breaking rules would not otherwise create a break at that location.

Try it

属性

¥Attributes

该元素仅包含 全局属性

¥This element only includes the global attributes.

注意

¥Notes

在 UTF-8 编码的页面上,<wbr> 的行为类似于 U+200B ZERO-WIDTH SPACE 代码点。特别是,它的行为类似于 Unicode bidi BN 代码点,这意味着它对 bidi 排序没有影响:当 <div dir=rtl>123,<wbr>456</div> 未断为两行时,显示 123,456 而不是 456,123

¥On UTF-8 encoded pages, <wbr> behaves like the U+200B ZERO-WIDTH SPACE code point. In particular, it behaves like a Unicode bidi BN code point, meaning it has no effect on bidi-ordering: <div dir=rtl>123,<wbr>456</div> displays, when not broken on two lines, 123,456 and not 456,123.

出于同样的原因,<wbr> 元素不会在换行点处引入连字符。要使连字符仅出现在行尾,请改用软连字符实体 (&shy;)。

¥For the same reason, the <wbr> element does not introduce a hyphen at the line break point. To make a hyphen appear only at the end of a line, use the soft hyphen character entity (&shy;) instead.

示例

¥Examples

雅虎风格指南 建议使用 在标点符号之前打断 URL,以避免在行尾留下标点符号,读者可能会误认为是 URL 的结尾。

¥*The Yahoo Style Guide* recommends breaking a URL before punctuation, to avoid leaving a punctuation mark at the end of the line, which the reader might mistake for the end of the URL.

html
<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>

结果

¥Result

技术总结

¥Technical summary

内容类别 流量内容, 措辞内容.
允许的内容 空的
标签遗漏 必须有开始标记,并且不能有结束标记。
允许的父级 任何接受 措辞内容 的元素。
隐式 ARIA 角色 没有对应的角色
允许的 ARIA 角色 任何
DOM 接口 HTMLElement

规范

Specification
HTML Standard
# the-wbr-element

¥Specifications

浏览器兼容性

BCD tables only load in the browser

¥Browser compatibility

也可以看看