您的位置:首页 - web前端
去掉ie6下li之间多出的间隔
ie6下li之间多出间隔的原因和解决办法:
ie6下,当<li>标签中的内容是一个<a>元素并且a标签或a标签里面的子元素如:<img/>标签设置了“display:block”,此时ie6浏览器中,将不会忽略列表标签li之间的空格,表现为显示成额外的一行夹在<li>标签之间。

问题代码:

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>标签对内的所有空格也能解决这个问题,但这样会降低代码的可读性,故不推荐这种处理方法
本站导航
相关文章
柯乐义 Copyright© keleyi.com