WebMD
本页大纲

弹性布局(Flexbox)

缩写:Flex

简述

一维布局:在主轴/交叉轴分配弹性项目的尺寸与对齐。

使用场景

导航、工具条、等分、垂直居中。

组成与要点

display:flex
justify/align 对齐
flex-grow/shrink/basis

实践与应用

• 先定 flex-direction
• 用 gap 管理间距(支持时)

注意事项

• min-width:auto 撑破容器

关联术语

• Grid:二维对照
• 盒模型:项目尺寸