wbr和nobr标签的应用

wbr和nobr标签的应用

2009年2月17日 1,702 人浏览 发表评论 阅读评论

首先请原 谅园子 会 告诉你wbr这标签，一个已经不再WEB标准 中 存在的标签，虽然很多设计师（比如Google）还在用着它，因为它有个作用是css 无法达到的。

如果你在网页上显示很长的英文单词或者网址时，我们并没有很好的办法在所有的浏览器中用CSS控制它换行，但是这个标签可以做到，作用于不会自动换 行的区域中时，它会根据实际情况决定是否换行。假如：

1 2 3 4 5 6 7

<ul> <li><a href=”#” mce_href=”#”title=”妈妈说就算你注册的域名再长google都能搜索出来”> http://www.mamashuojiusuannizhucedeyumingzaichanggoogledounengsousuochulai.cn/</a></li> <li><a href=”#” mce_href=”#” title=”妈妈说就算你注册的域名再长google都能搜索出来”> http://www.<wbr />mama<wbr />shuo<wbr />jiusuan<wbr />ni<wbr />zhucede<wbr />yuming<wbr />zaichang<wbr />google<wbr />douneng<wbr />sousuo<wbr />chulai<wbr />.cn/</a></li> </ul>

 

上图是在浏览器窗口够大的情况下的显示效果，我们可以看出如果宽度足够的话，<wbr>并没有起作用（图2.6），但是，如果宽度没有 连着的英文那样长的话就会出现像下这样的显示效果：

除了IE5~6会撑开容器外，其他的浏览器都是溢出容器，<wbr>能在需要换行的地方进行换行，虽然像这样长的网址几乎不存在，但在制作网 页时，常常会遇到类似这种情况，除了网址，一些中文的字符也不会自动换行，虽然IE有私有的CSS属性能让它强制换行，但其它浏览器就必须使用其他的方 式。

与wbr作用相反的标签，同样不再Web标准中存在的标签，它是强制某些会换行的内容让其不换行，这个标签并不推荐使用，因为我们可以通过CSS来 实现它的功能。避免使用表现类的标签可以让我们向实现结构与表现的分离走近一小步，同时也要避免教条般的使用，应按需要使用。

<!-- 添加版权信息 -->

原创文章如转载，请注明：转载自园子博客 [ http://www.yzznl.cn ]