flex布局水平居中

要实现Flex布局的水平居中，可以通过在父元素上设置`justify-content: center;`属性。这将使子元素在水平主轴上居中对齐。例如，可以在父元素的CSS样式中添加以下代码：

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

这样，子元素将在父元素中水平居中对齐。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* [Flex布局](https://download.csdn.net/download/weixin_38610870/16215679)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT0_1"}}] [.reference_item style="max-width: 33.333333333333336%"]
- *2* [利用flex实现元素水平垂直居中](https://blog.csdn.net/xiecheng1995/article/details/96478769)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT0_1"}}] [.reference_item style="max-width: 33.333333333333336%"]
- *3* [flex布局水平居中](https://blog.csdn.net/ZHU20200222/article/details/104582264)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT0_1"}}] [.reference_item style="max-width: 33.333333333333336%"]
[ .reference_list ]