html - 如何减少圆圈中两行文本之间的空间

Question

我得到一个带有 2 行文本的圆圈。 第一个说:P 第二个说:出版物。

他们之间的空间目前太大了。有没有办法让空间变小？

.circle1 {
  font-family: Arial;
  text-align: center;
  background: #73B7DB;
  border-radius: 100px;
  width: 110px;
  height: 105px;
  padding-top:5px;
  color: #fff;
  margin: 0 auto;
}
.Capital {
  margin: 0px 0 0px 0;
  line-height:70px;
  font-size: 60px;
  font-weight:ligter;
}
.text {
  text-align: center;
  margin-top: 0px !important;
  font-weight: 100;
  font-size: 15px;
}

<div class="circle1">
  <h2 class="Capital">P</h2>
  <span class="text">Publications</span>
</div>

Answer 1

尝试负 margin。像 margin: 0px 0 -10px 0 用于 .Capital。

.circle1 {
  font-family: Arial;
  text-align: center;
  background: #73B7DB;
  border-radius: 100px;
  width: 110px;
  height: 105px;
  padding-top: 5px;
  color: #fff;
  margin: 0 auto;
}

.Capital {
  margin: 0px 0 -10px 0;
  line-height: 70px;
  font-size: 60px;
  font-weight: ligter;
}

.text {
  text-align: center;
  margin-top: 0px !important;
  font-weight: 100;
  font-size: 15px;
}

<div class="circle1">
  <h2 class="Capital">P</h2>
  <span class="text">Publications</span>

</div>