html - 为网络游戏记分牌编写 CSS 布局

Question

<分区>

Answer 1

试试这个:

.score-board {
  text-align: center;
  padding: 25px;
}
.player {
  display: inline-block;
  padding: 15px;
}
.player h4 {
  font-weight: bold;
}
.score-box {
  border: 3px solid black;
  padding: 30px;
  color: #2CB3C9;
}

<div class="score-board">
  <div class="player">
    <h4>Player 1</h4>
    <div class="score-box">
      15
    </div>
  </div>
  <div class="player">
    <h4>Player 2</h4>
    <div class="score-box">
      10
    </div>
  </div>
</div>