站長資訊網css讓塊無間隙的實現方法：首先創(chuàng)建一個HTML示例文件；然后定義一個內聯元素span為inline-block元素；最后移除標簽間的空格即可。
本文操作環(huán)境：Windows7系統(tǒng)、HTML5&&CSS3版，DELL G3電腦
最近做移動端頁面時，經常會用到inline-block元素來布局，但無可避免都會遇到一個問題，就是inline-block元素之間的間隙。這些間隙會導致一些布局上的問題，需要把間隙去掉。對于inline-block元素及去掉間隙的方法，在這里做一個簡單的總結。
注：在html中div、 p、hx、form、ul 、 li、dl、dd就是塊級元素。
inline-block是什么？
inline-block 即內聯塊,在CSS的元素分類中可以分成三種：行內元素或者內聯元素、塊級元素、以及內聯塊元素。
內聯塊元素具有了內聯元素以及塊級元素的特性：（1）元素之間可以水平排列 （2）可以當做一個塊級元素來設置各種的屬性，例如：width、height、padding等。
例子1：定義一個內聯元素span為inline-block元素
<!DOCTYPE html > <html> <head> <style type="text/css"> div{ background: red; display:inline-block; } </style> </head> <body> <div>這是一個div</div> <div>這是一個div</div> <div>這是一個div</div> </body> </html>
效果如下：
移除inline-block導致div間隙的方法：
1、移除標簽間的空格
元素間的間隙出現的原因是元素標簽之間的空格，把空格去掉間隙自然就會消失。
<!DOCTYPE html > <html> <head> <style type="text/css"> div{ background: red; display:inline-block; } </style> </head> <body> <div>這是一個div</div><div>這是一個div</div><div>這是一個div</div> </body> </html>
效果如下：
2、將所有div放到同一個div中
<!DOCTYPE html > <html> <head> <style type="text/css"> div{ background: red; display:inline-block; } </style> </head> <body> <div> <div>這是一個div</div> <div>這是一個div</div> <div>這是一個div</div> </div> </body> </html>
效果如下：
3、通過設置父元素的font-size:0來解決這個問題
該方法適用于只包含圖片的div
【推薦學習：css視頻教程】
