Q31
★ ★ ★ ★ ★
多列等高布局怎么实现？
⚡ 速记答案（30 秒）
Flex：align-items:stretch，每列不同高度但背景看起来等高。Grid：列自动等高。老方案：用 display:table / table-cell。
📖 详细讲解
标准面试回答（推荐记住）
多列等高布局有几种实现方式。最简单的是 Flex，父元素默认 align-items: stretch，子元素会自动拉伸到等高。Grid 布局也是默认等高。老方案是用 display: table 和 table-cell，模拟表格的等高特性。还有一种技巧是用 padding-bottom 配合 margin-bottom 负值，视觉上实现等高效果。现代项目推荐直接用 Flex 或 Grid。
✅ 面试要点
- •Flex 默认 stretch 等高
- •Grid 自动等高
- •table-cell 老方案