如何消除开发过程中两个水平排列的块级元素之间的空隙

第一步，给这两个块级元素加一层包装，也就是在它们外部套一层div

第二步，外层的这个父元素的font-size设置为0.

第三步，在这两个块级元素内，将font-size改回正常水平

 

原因分析：

如下的两个div在水平排列时是不会有间隙的

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

但是如果写成下面这样，就会出现间隙

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

实际上，这两个div在分成两行来写的时候，它们中间会被自动填入一个text节点，也就是会出现空格，表现出来就是间隙

第一种写法显然不适合开发过程。因此在第二种写法中，将两个div同一层级的字体大写设置为0，那个空格自然就没有了大小。间隙也就不存在了。