CSS 水平垂直居中

Grid 布局

html

<div class="container">
  <div></div>
</div>

<div class="container">
  <div></div>
</div>

css

.container {
  display: grid;
  place-content: center;
}

.container {
  display: grid;
  place-content: center;
}

html

<div class="container">
  <div class="box"></div>
</div>

<div class="container">
  <div class="box"></div>
</div>

css

.container {
  display: flex;
}
.box {
  margin: auto;
}

.container {
  display: flex;
}
.box {
  margin: auto;
}