如何解决删除display:flex会在链接周围添加空格为什么?
这是因为flexbox删除inline
或inline-block
元素之间的默认空白。
这是没有flexbox的代码,其中有空格:
.box {
font-size:30px;
}
<div class="box">
<a>click</a>
<a>here</a>
</div>
我们可以通过从标记中删除它或使用任何常用方法来删除该空白:
.box {
font-size:30px;
}
<div class="box">
<a>click</a><a>here</a>
</div>
或通过使div成为flexbox容器:
.box {
display:flex;
font-size:30px;
}
<div class="box">
<a>click</a>
<a>here</a>
</div>
如果我们检查规格:
flex容器的每个流入子元素都将成为一个flex项目,并且每个连续的子文本序列序列都被包装在一个匿名块容器flex项目中。但是, (即可能受white-space属性影响的字符) 空格(就像其文本节点显示为:none一样)。
因此,在我们的代码中,我们有两个子项和一个不带空格的空白序列。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。