display: flex; 垂直居中

以下是使用display: flex;实现垂直居中的方法：

.container {
  display: flex;
  justify-content: center; /* 水平居中 */
  align-items: center; /* 垂直居中 */
  height: 200px; /* 设置容器高度 */
}

这里的.container是一个包含需要垂直居中的元素的父容器。通过设置display: flex;将父容器变为弹性容器，然后使用justify-content: center;将子元素水平居中，使用align-items: center;将子元素垂直居中。最后，通过设置容器的高度来控制垂直居中的效果。