我正在尝试使用 anchor 标签创建一个菜单，它们应该紧挨着，这样相关的链接就可以用边框连接起来。下面是一些示例代码:
<html>
<head>
<style type="text/css">
a {
border: 1px solid #939393;
margin: 15px;
padding: 8px;
}
a:hover {
border-color: #111;
}
a.collapse-left {
border-left-width: 0px;
margin-left: 0px;
}
a.collapse-right {
border-right-width: 0px;
margin-right: 0px;
}
</style>
</head>
<body>
<div class="body">
<a href="#" class="collapse-right primary">This is</a>
<a href="#" class="collapse-right collapse-left click">A group</a>
<a href="#" class="collapse-left hover">Of Three</a>
<a href="#" class="">I am by myself</a>
<a href="#" class="collapse-right">We are</a>
<a href="#" class="collapse-left">a pair</a>
</div>
</body>
</html>
组合在一起的按钮之间有一些空白。这是由 <a> 之间的换行符引起的标签。可以删除这些换行符，问题就消失了，但代码的可读性大大变差了。
是否可以保留换行符但不显示空格？
最佳答案
您应该通过更改 <a> 的 CSS 将框变成 block 对此:
a {
border: 1px solid #939393;
margin: 15px;
padding: 8px;
display: block;
float: left;
}
关于html - 如何让标签之间的空格不显示？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/522435/