如何在同一个div中的两个<a>标记之间留出空格

<div>
  <a href="#">链接1</a>&nbsp;<a href="#">链接2</a>
</div>

<div>
  <a href="#" class="link">链接1</a><a href="#" class="link">链接2</a>
</div>

<style>
.link + .link {
  margin-left: 10px; /* 调整间距 */
}
</style>

<div>
  <a href="#">链接1</a><span class="spacer"></span><a href="#">链接2</a>
</div>

<style>
.spacer {
  width: 10px; /* 调整间距 */
}
</style>

<div>
  <a href="#">链接1</a><br><a href="#">链接2</a>
</div>