CSS3 弹性盒子简介

    当页面需要适应不同的屏幕大小以及设备类型时，CSS3弹性盒（Flexible Box或flexbox )确保元素拥有恰当的行为布局方式。

    传统的div+css布局方式是依赖于盒子模型的，基于display属性，如果需要的话，还会用上position和float属性，但是这些属性想要应用于特殊布局则非常困雉（如垂直居中）。对于新手来说，这些属性极其不友好。很多新手弄不清楚absolute和relative的区别。当它们应用于元素时，新手很难明白这些元素的top、left等值到底是相对于页面还是父级元素来进行定位。

    在2009年，W3C提出了一种新的方案一Flex布局。Flex布局可以更加简便地完整地实现各种页面布局方案。flex-box (弹性盒子）用于给盒子模型以最大的灵活性，任何一个容器都可以设置成一个弹性盒子。需要注意的是，设为Flex布局以后，子元素的float、clear和vertical-align属性将会失效。