使用CSS如何最好地显示名称值对？

<div class="name-value-pair">
  <span class="name">名称：</span>
  <span class="value">值</span>
</div>

.name-value-pair {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-gap: 10px;
  align-items: center;
}

.name {
  font-weight: bold;
}

<div class="name-value-pair">
  <span class="name">名称：</span>
  <span class="value">值</span>
</div>

.name-value-pair {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.name {
  font-weight: bold;
  margin-right: 10px;
}