当使用display:inline-block时，元素间会出现符合W3C标准的间隙，由换行符引起。解决方法包括避免书写空格，设置父元素font-size为0，以及使用负margin，其中前两者为推荐做法。
display：inline-block的缝隙
<style type="text/css">
*{
border: 0;
padding: 0;
margin: 0;
}
ul li{
display: inline-block;
border: 1px solid #000000;
}
</style>
<body>
<ul>
<li>1111</li>
<li>2222</li>
<li>3333</li>
<li>4444</li>
<li>5555</li>
</ul>
</body>
这每个li之间的间隙是符合W3C标准规范的表现，是元素书写的时候换行产生的空白符造成的问题。但不满足业务需求。完善这种的缝隙有如下几种方法：
一、书写的时候，省略空格
<body>
<ul>
<li>1111</li><li>2222</li><li>3333</li>
最低0.47元/天 解锁文章
扫一扫
1268
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
