CSS 弹性盒子布局

CSS 弹性盒子布局是 CSS 的模块之一,定义了一种针对用户界面设计而优化的 CSS 盒子模型。在弹性布局模型中,弹性容器的子元素可以在任何方向上排布,也可以“弹性伸缩”其尺寸,既可以增加尺寸以填满未使用的空间,也可以收缩尺寸以避免父元素溢出。子元素的水平对齐和垂直对齐都能很方便的进行操控。通过嵌套这些框(水平框在垂直框内,或垂直框在水平框内)可以在两个维度上构建布局。

参考

CSS 属性

指南

使用 CSS 弹性盒子
循序渐进的讲解如何用此特性来建立布局。
用弹性盒子进行 Web 应用布局
讲解在 Web 应用的特定环境下如何应用弹性盒子。

规范

规范 状态 注解
CSS Flexible Box Layout Module Candidate Recommendation 初始定义。

浏览器兼容性

特性 Firefox (Gecko) Chrome Internet Explorer Opera Safari
基础支持 20.0 (20.0) 21.0-webkit
29.0
10.0-ms
11.0
12.10 6.1-webkit
特性 Firefox Mobile (Gecko) Android IE Phone Opera Mobile Safari Mobile
基础支持 (Yes) 4.4 11 12.10 7.1-webkit

 

文档标签和贡献者

 此页面的贡献者: yofine, xgqfrms, WynnChen, Humyang, teoli
 最后编辑者: yofine,