弹性盒子可能会成为开发主流

弹性盒子

 

弹性盒布局模型（Flexible Box Layout）是 CSS3 规范中提出的一种新的布局方式。它可以用简单的方式满足很多常见的复杂的布局需求。

 

 

 

优势

 

 

 

开发人员只是声明布局应该具有的行为，而不需要给出具体的实现方式。浏览器会负责完成实际的布局。

 

 

 

该布局模型在主流浏览器中都得到了支持。

采用flex布局的元素，称为flex容器（flex container），简称“容器”。它的所有子元素自动成为容器成员，称为flex项目（flex item），简称“项目”。

容器默认存在两根轴：水平的主轴（main axis）和垂直的交叉轴（cross axis）。主轴的开始位置（与边框的交叉点）叫做main start （主轴起始），结束位置叫做main end （主轴结束）；交叉轴的开始位置叫做cross start （交叉轴起始），结束位置叫做cross end （交叉轴结束）。

 

项目默认沿主轴排列。单个项目占据的主轴空间叫做main size ，占据的交叉轴空间叫做cro