弹性布局displaybox与flex区别

• 弹性布局是针对Css3的一种新型布局，以一种高效的方式对容器里面的条目布局，对齐，分配空间。而且在位置宽度，高度，或者动态的页面任然可以布局。

• display: box;与display:flex;
  • 前者display:box是2009年的语法版本，使用时需要加上浏览器的前缀，不过现在已经过时了。
  • 后者display:flex是2012年最新修正的语法版本，浏览器支持较好，也将成为以后标准的语法。
  • 中间2011年也提出了一个奇葩的语法版本display:flexbox
    ，非官方的，当时主要是为IE浏览器使用。
  • 前者是09年之前的规定的写法，后者是12年并且是现在的规范。
  • 前者是早期浏览器前期支持的写法，后者是现代浏览器支持的写法。
  • display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ / display: -moz-box; / Firefox 17- /
    display: -webkit-flex; / Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 /
    display: -moz-flex; / Firefox 18+ /
    display: -ms-flexbox; / IE 10 /
    display: flex; / Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
• 参考网址 http://www.zhangxinxu.com/wordpress/?p=1338 https://segmentfault.com/q/1010000003497333