创建一条带有圆的垂直线，其两侧的文本与圆对齐

<div class="container">
  <div class="circle"></div>
  <div class="text">左侧文本</div>
  <div class="text">右侧文本</div>
</div>

.container {
  display: flex;
  align-items: center;
}

.circle {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: black;
  margin-right: 10px;
}

.text {
  display: flex;
  align-items: center;
}