消除display: inline-block引起的元素之間的縫隙

使用display: inline-block排版，元素之間出現縫隙，并沒有使用任何margin設置。

原因就是元素被當成行內元素排版的時候，元素之間的空白符（空格、回車換行等）都會被瀏覽器處理，根據white-space的處理方式（默認是normal，合并多余空白），原來HTML代碼中的回車換行被轉成一個空白符，所以元素之間就出現了空隙。

解決方法：在父元素設置font-size: 0， 然后在子元素上重置正確的font-size，這樣就ok了~

最后編輯于 ：
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明：文章內容（如有圖片或視頻亦包括在內）由作者上傳并發布，文章內容僅代表作者本人觀點，簡書系信息發布平臺，僅提供信息存儲服務。

推薦閱讀更多精彩內容