display:inline-block 元素间间距去除方法

display:inline-block 元素都会有间距 ，如图：

为此给大家分享几种解决方法：

1：元素间的间距是因为标签间的间距，所以我们可以直接去掉HTML的空格，但是考虑到代码可读性，所以不可能写成一行，那可以直接按照以下方式写：

<div>哈哈哈哈</div><!----><div>哈哈哈哈</div><!----><div>哈哈哈哈</div><!----><div>哈哈哈哈</div><!----><div>哈哈哈哈</div>

借助HTML注释；

<div>   哈哈哈哈</div><div>哈哈哈哈</div><div>哈哈哈哈</div><div>哈哈哈哈</div><div>哈哈哈哈</div>

或者

<div>哈哈哈哈</div><div>哈哈哈哈</div><div>哈哈哈哈</div><div>哈哈哈哈</div><div>哈哈哈哈</div>

2：使用font-size:0;

.box{    font-size: 0;    -webkit-text-size-adjust:none;/*兼容谷歌最小字體限制*/}.box a{    display: inline-block;    font-size: 10px;}

3：使用word-spacing：

.box{    display: inline-table;/* 如果谷歌不好用可以加上这句，瞬间变得乖乖的，绝不再淘气*/    word-spacing: -6px;}.box a{    display: inline-block;    word-spacing: 0;}

OK啦，其他方式个人感觉不是很好用，以上三种还是比较方便 靠谱的，希望可以帮到大家！