display:felx 居中
时间: 2023-08-22 11:07:30 浏览: 78
要将flex容器内的元素居中,可以使用以下CSS属性和值组合:
```css
display: flex;
justify-content: center;
align-items: center;
```
其中,`display: flex;`将容器设置为弹性布局。`justify-content: center;`将元素在主轴上居中对齐,而`align-items: center;`将元素在交叉轴上居中对齐。这样,flex容器内的元素就会水平和垂直居中了。\[3\]
#### 引用[.reference_title]
- *1* [display:flex 元素垂直居中,有间距,右对齐,gap属性](https://blog.csdn.net/xutongbao/article/details/119994687)[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^v91^insert_down1,239^v3^insert_chatgpt"}} ] [.reference_item]
- *2* *3* [什么是弹性(display: flex)布局 ?](https://blog.csdn.net/weixin_41044151/article/details/114071215)[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^v91^insert_down1,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]
阅读全文