空格导致行内元素水平间隔问题_html/css
2020-11-27
来源：独旅网
1 行内元素2 行内元素3 行内元素4 行内元素
效果如下图：
导致这种问题出现的原因在于html中span便签之间的空格。如果去掉空格那么就不会有间隔。
行内元素行内元素行内元素
效果如下图：
虽然找到了问题所在，可是如果有多个行内元素，代码挤在一行会造成阅读困难，怎么办呢？
拓展阅读：1.【原】行内元素产生水平空隙是bug吗 - 白树 - 博客园
http://www.cnblogs.com/PeunZhang/archive/2012/09/28/2706094.html
2. http://davidwalsh.name/remove-whitespace-inline-block
经过上网搜索资料，发现"行内元素之间产生的间距，是由于换行符、tab(制表符)、空格等字符引起，而字符的大小是定义字体大小来控制",所以去除间隔可以从改变字体的大小入手。即font-size：0；不过具体使用还得做相应调整，不一定是值为0。
显示全文