ie6下li间会多出一行空白

 

在ie6浏览器下，当<li>标签中的内容是一个<a>元素并且a标签或a标签里面的子元素如：<img/>标签设置了“display:block”，此时ie6浏览器中,将不会忽略列表标签li之间的空格，表现为显示成额外的一行夹在<li>标签之间。这里其实不不止a元素是这样，想h1,h2等也是的

现象如下：

问题代码：

li a{display:block;background:#f00;}

<ul><li><a href="#">测试</a></li><li><a href="#">测试</a></li><li><a href="#">测试</a></li></ul> 建站资源

解决办法：

方法一：(推荐)

    避免将li标签里面的a元素或a元素里面的子元素设成display:block，将对应样式加在li标签里面。

方法二：(推荐)

    触发a标签或a标签子元素的haslayout，如给a加下面属性：

li a{*height:1%;}

    当然删除<ul></ul>标签对内的所有空格也能解决这个问题，但这样会降低代码的可读性，故不推荐这种处理方法

关注程序员人生网， www.wfuyu.com 关注互联网前沿技术