html 行内元素引起的空白间距问题
这篇文章发表于 2022年04月29日,星期五,16:33
是由于空格、换行引起的
<div class="container">
<span class="item">131313131313131</span>
<span class="item">131313131313131</span>
<!-- <div class="subfix"></div> -->
</div>
两个span之间使用换行的话就回出现空格,那就换成如下的写法
<div class="container">
<span class="item">131313131313131</span><span class="item">131313131313131</span>
</div>
这样就没问题了,但是为了代码的可读性,肯定不能这么写,所以可以使用如下方法
.container {
font-size: 0;
}
.item {
font-size: 12px;
background-color: gray;
}
这只外层元素的font-size:0,内层元素重新设置字体即可消除。
其他方法:
.container {
letter-spacing: -3px;
}
.item {
font-size: 12px;
background-color: gray;
letter-spacing: 0;
}
关于博主: 评论和私信会在第一时间回复
版权声明: 本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!