HTML li 标签之间空白间隔的解决办法
2016-09-19 13:39
211 查看
问题描述：
做抽屉式菜单时候，在 ie 7 下发现 li 元素之间会留白，如下图：
原以为是样式的问题，后来看到有博文写到“行框的排列会受到中间空白（回车\空格）等的影响，因为空格也属于字符，这些空白也会被应用样式，占据空间，所以会有间隔”。
解决办法：
li 标签之间的空白，可以通过设置 li 标签的 font-size 为 0，可以解决：
做抽屉式菜单时候，在 ie 7 下发现 li 元素之间会留白，如下图：
原以为是样式的问题，后来看到有博文写到“行框的排列会受到中间空白（回车\空格）等的影响，因为空格也属于字符，这些空白也会被应用样式，占据空间，所以会有间隔”。
解决办法：
li 标签之间的空白，可以通过设置 li 标签的 font-size 为 0，可以解决：
li{
padding:0;
margin:0;
height: 30px;
line-height: 30px;
font-size: 0; /* 设置 font-size 为 0 即可 */
}修改后的效果如图：
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- li与li之间有看不见的空白间隔是什么原因引起的？有什么解决办法？
- li与li之间有看不见的空白间隔是什么原因引起的？有什么解决办法？
- php strp_trags()去除html标签仍有空白解决办法
- Word中行与行之间存在空白，而且删不掉的解决办法
- inline-block元素之间空白间距的解决办法
- span，a标签，label标签文字右边的1px空白的解决办法
- div和img标签之间存在空的解决办法
- 两个div之间有间隔的解决办法
- <li><img>标签之间空隙解决办法
- <li>标签在ie6下的上下间隔的BUG解决办法
- select标签中的单选和多选解决办法
- Windows XP 中用户管理窗口空白，服务管理扩展窗口空白的解决办法
- Oracle 10G安装完, EM网页为空白的解决办法
- window 2003 资源管理器的搜索助理变成空白现象的解决办法
- img 标签下多余空白的解决方法
- XP客户端和域控之间安全通道损坏的解决办法
- Freemarker中访问Struts2的select标签的问题以及解决办法
- webwork/struts2 直接运行带有 标签页面出错的解决办法
- XP客户端和域控之间安全通道损坏的解决办法
- php 存储中文字符到数据库时意外空白,未能成功保存的解决办法