CSS 技巧篇(六):display设置元素为行内元素时,元素之间存在间隙问题

问题

在使用display将元素设置为行内元素的同时(例如:inline、inline-block等),将margin所有设置为0,padding所有设置为0的时候,我发现了元素之间竟然还存在着间隙!!!???以下图所示: 字体

在这里插入图片描述


缘由

之因此存在间隙是因为元素标签之间留有空白字符形成的。cdn

解决方案

一、第一种 消除元素标签之间的空白字符,把标签连在一块儿。blog

二、第二种:
第一步:在这些行内元素的父元素上设置font-size设置为0;
第二步:在行内元素上设置正常的字体显示大小,例如:font-size:14px;图片

以下图显示: it

在这里插入图片描述


这个时候行内元素之间的间隙就消失不见了!io

相关文章
相关标签/搜索