flex-layout是一个基于css3 flexbox的栅格化布局库,提供更直观、丰富的布局方式,可以轻松解决垂直居中,多栏同高等问题。
项目地址: https://github.com/coffcer/flex-layout
文档与demo:http://coffcer.github.io/flex-layout
与传统的栅格化相比,flex-layout解决了css布局的不少问题:
与传统的栅格化一样,flex-layout基于容器(相当于Bootstrap的row) 和栅格(相当于Bootstrap的column) 来布局:
[容器]有两种:
flex-column: 容器里的[栅格]以横向排列,与传统栅格化的row一样
flex-row: 容器里的[栅格]以竖向排列,就像header、content、footer的排列一样
通常,只有[栅格]可以直接放在[容器]中,而你的内容应该放在[栅格]里。但这不是必须的,直接把内容放在[容器]里也没问题。
具体看文档 http://coffcer.github.io/flex-layout
由于使用flexbox,IE系列只兼容IE10+,其他主流浏览器基本兼容。