当我们使用"display:inline-block"把块集元素转换为内联元素时，每两个内联元素之间有一定的空隙，既不是margin也不是padding，最终发现是由于换行符、制表符（tab）、空格等字符引起的。
解决方案：
1、第一种，不换行
既然是换行产生的，那么我们不换行就是了。所以第一种办法就是把所有的代码都写到一行，便不会产生空隙了。
<el-aside class="aside">Aside</el-aside><el-main class="main">Main</el-main>
2、改变font-size
这个换行是字符吧，那么我们把字体大小改为0，他便不会产生了。 设置其父容器的font-size为0，再设置内联元素的字体大小。
3、添加注释
<el-aside class="aside">Aside</el-aside><!--
--><el-main class="main">Main</el-main>
当我们使用"display:inline-block"把块集元素转换为内联元素时，每两个内联元素之间有一定的空隙，...
一、还原分页样式 display:inline与display:inline-block; 数字之间的空隙是为什么...
CSS3 display:inline-block元素之间空隙的产生原因和解决办法 在CSS布局中，如果我们想要将...
去除两个span设置的display: inline-block 之间的空隙，可以给两个span的父元素设置fon...
作者:Chris Coyier 问题描述 html css 最后的结果 通常我们希望设置inline-block的...
1、font-size:0的作用有时候inline-block元素会莫名的遇到空白的空隙
第一部分 inline-block一、inline-block之间的缝隙(inline-block再ie8以下版本...
原因：我们写代码时习惯写一个标签换一行，但在设置为display:inline-block之后，代码里的换行符变成...
显示方式 inline-block 默认为行内块级元素，所以之间会有缝隙。 对齐方式 inline-block 没...
display:inline-block后会出现一段空隙必须随带下一句代码消除 vertical-align: t...
本文标题：inline-block之间的空隙
本文链接：https://www.haomeiwen.com/subject/bdxamctx.html
网友评论