当前位置:园子博客 » Xhtml » wbr和nobr标签的应用

wbr和nobr标签的应用

2月 17th, 2009 | Filed under Xhtml | 共有32,562次浏览

首先请原谅园子会告诉你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来实现它的功能。避免使用表现类的标签可以让我们向实现结构与表现的分离走近一小步,同时也要避免教条般的使用,应按需要使用。

  1. QQ远航
    11月 20th, 200910:45

    腾讯的日志很多这个东东..

  2. wjq
    9月 28th, 200916:03

    keyi

您必须在 登录 后才能发布评论.