弹性flex 是一个 CSS 的 display 属性中新添加一个值。与 inline-flex 一起,它将使应用了它的元素变成弹性容器,而这个元素的每个子元素将变成弹性项目。弹性项目会参与弹性布局,所有由 CSS 弹性盒子布局模块定义的属性都能被它们使用。 flex 属性是 flex-grow、flex-shrink 和 flex-basis 属性的简写。 此外,<flex> 可以作为弹性长度在 CSS 网格布局中使用。参见属性参考 align-content align-items align-self flex flex-basis flex-direction flex-flow flex-grow flex-shrink flex-wrap justify-content order 延伸阅读 CSS 弹性盒布局模型第一版规范 CSS 弹性盒子指南: 弹性盒子的基本概念 弹性盒子与其他布局方法的关系 对齐弹性容器中的弹性项目 弹性项目排序 控制主轴上弹性项目的比率 掌握弹性项目的包装 弹性盒子的典型用例