テキストを垂直方向に中央揃えにする方法に関する注意事項

最初の方法: line-height をその要素の高さに等しく設定しますが、欠点は、その要素の高さを決定する必要があることです。

.test {
  width: 200px;
  height: 100px;
  border: 1px solid blue;
  //第一种
  line-height: 100px;
}

2 番目の方法: 2 番目の表セルと中央の組み合わせ

.test {
  width: 200px;
  height: 100px;
  border: 1px solid blue;
   //第二种 table-cell 加 middle组合
  display: table-cell;
  vertical-align: middle;  
}

3番目の方法:

.test {
  width: 200px;
  height: 100px;
  border: 1px solid blue;
   //第三种  flex加center
  display: flex;
  align-items: center;
}

効果：

<div class="test">1234</div>