去除inline-block标签间距方法

一、描述

在真正意义上的inline-block水平呈现的元素间，换行显示或者空格分隔的情况下会有间距；

二、几种结局方案

方法一：移除标签间空格

 
 惆怅 淡定 热血 
 

或者

 
 惆怅淡定热血 
 

还可以利用注释

 
 惆怅淡定热血 
 

方法二：让闭合标签吃胶南

 
 惆怅 淡定 热血 
 

兼容IE6/IE7的写法

 
 惆怅 淡定 热血 
 

方法三：可以使用fond-size:0

除了chrome浏览器有最小字体的限制外，大多数的浏览器都可以通过这种方法，所以考虑到兼容性可以在样式表中写入：

 .inline-block { font-size:0; -webkit-text-size-adjust:none; }
 

方法五：可以使用word-spacing样式

 .inline-block { word-spacing:-100px; }
 

因为word-spacing的值小到一定程度后，兼容性的差别就可以忽略，值再小字体也不会发生重叠。