flex 两个盒子居中
时间: 2023-08-17 10:13:16 浏览: 150
回答: 要实现两个盒子居中,可以使用flex布局。在父盒子上设置display: flex;和justify-content: center;属性,这样子盒子就会水平居中对齐了。同时,可以给子盒子设置flex: 1;属性,使它们平分剩余空间。\[2\]另外,如果想要实现中间盒子占满剩余空间,可以给中间盒子设置flex: 1;属性。这样中间盒子会自动占据剩余的空间,实现自适应效果。\[3\]
#### 引用[.reference_title]
- *1* [flex布局,盒子居中,圣杯模型](https://blog.csdn.net/qq_46159033/article/details/123976006)[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* [flex布局+flex进行盒子居中+伸缩比+圣杯布局](https://blog.csdn.net/weixin_68665257/article/details/129455211)[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 ]
阅读全文