flex布局文本垂直水平居中

可以使用 flex 布局实现文本垂直水平居中，具体实现方法如下：

HTML代码：

<div class="container">
  <div class="content">这是一段文本</div>
</div>

CSS代码：

.container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 200px;
}

.content {
  text-align: center;
}

解释：

`.container` 使用 flex 布局，并设置了 `justify-content: center;` 和 `align-items: center;`，使其子元素在横向和纵向上都居中对齐。

`.content` 设置了 `text-align: center;`，使文本在水平方向上居中对齐。