根本原因：inline-block元素之間之所以有空白間距是因?yàn)榭崭裼凶煮w大小原因。

?

第一種：

　　把代碼之間的換行空白都去掉。

? ? ? 例如：

? ? ?<div>第一個(gè)inline-block元素</div><div>第二個(gè)inline-block元素</div>

第二種：　　

　　把inline-block元素用一個(gè)大的div包起來，然后設(shè)置其字體大小為0即可，inline-block元素字體大小再單獨(dú)設(shè)置。

　　例如：

? ? ?<div style=”font-size:0" class="space">
? ? ? ? ? <div>第一個(gè)inline-block元素</div>
? ? ? ? ? <div>第二個(gè)inline-block元素</div>
? ? ?</div>

這個(gè)方法，基本上可以解決大部分瀏覽器下inline-block元素之間的間距(IE7等瀏覽器有時(shí)候會(huì)有1像素的間距)。不過有個(gè)瀏覽器，就是Chrome, 其默認(rèn)有最小字體大小限制，因?yàn)?#xff0c;考慮到兼容性，我們還需要添加：?

類似下面的代碼：

.space {

??? font-size: 0;

??? -webkit-text-size-adjust:none;

}

?

總結(jié)

以上是生活随笔為你收集整理的去除inline-block元素间间距的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。