flex 布局 居中

使用 flex 布局可以通过以下两种方式实现居中：

1. 水平居中：将父元素的 display 属性设置为 flex，然后设置 justify-content 属性为 center。

.parent {
  display: flex;
  justify-content: center;
}

2. 垂直居中：将父元素的 display 属性设置为 flex，然后设置 align-items 属性为 center。

.parent {
  display: flex;
  align-items: center;
}

如果需要同时实现水平和垂直居中，可以将上述两种方式结合起来使用。