「这是我参与2022首次更文挑战的第12天，活动详情查看：2022首次更文挑战」
前言
大家都放假了吗？过年可太快乐了，但是学习不能停（这太有挑战了）。今天继续学习，了解一下 'wbr' 这个标签。
wbr 标签
HTML里有一个 wbr 元素标签，是用来实现连续英文和数字的精准换行的，具体效果是如果宽度足够就不换行，如果宽度不足则在 wbr 元素在的位置进行换行。
原理
它之所以可以提供一个换行的机会是因为它创建了一个带有换行特性的宽度为0px的空格。这个空格的Unicode编码是U+200B，因此这个标签也可以替换为
​
即如下两种写法均可以达到相同的效果:
<p>大家好，<wbr>祝大家新年快乐！</p>
<p>大家好，​祝大家新年快乐！</p>
但是第二种写法的语义不如第一种好，还是建议使用第一种。
IE浏览器并不支持 wbr 标签，但是加上如下的css代码，它在IE浏览器上也会生效。
wbr：after{content:'\00200B';}
区别
我经常用到的换行标签是 br, 这篇文章就用了好几个，它是直接换行显示，不论宽度是否足够；而 wbr 则是 word break opportunity 的缩写，意思是有机会就会换行。而且 wbr 换行的时候不会有额外的字符显示，所以很适合英文单词的内容的换行，像那些URL网址之类的。
由于 wbr 需要提前插入，所以它比较适合文本内容固定的静态场景。
总结
大家都知道动态文本内容换行用word-break:break-all 和 word-wrap:break-word组合；还可以用line-break:anywhere 进行彻底换行；静态内容排版不适合用word-break属性、word-wrap属性、或者line-break属性，这个时候就可以考虑 wbr 属性。
