扫一扫分享
在移动端开发中,并不是所有的浏览器,webview,微信等各种版本都支持标准的flex, 但是基本上都会支持-webkit-box,所以flex.css的主要作用是保证每一个属性都能支持标准flex或旧版本的-webkit-box。 由于flex.css采用了autoprefixer编译,所以能够保证在浏览器不支持标准flex布局的情况下, 回滚到旧版本的-webkit-box,保证移动设备中能呈现出一样的布局效果。 于是,一款移动端快速布局的神器诞生了...
简洁的api,熟悉的属性值,入门毫无压力。 在html中采用属性的方式布,将布局和css进行分离,清晰的布局结构让你更容易维护,可以在不更改css的情况下更改布局。 特别是在react中使用data-flex属性布局,维护起来更加的方便。
flex布局分为旧版本display: box;,过渡版本dispaly: flexbox;,以及现在的标准版本display: flex;
Android
2.3 开始就支持旧版本 display:-webkit-box;
4.4 开始支持标准版本 display: flex;
IOS
6.1 开始支持旧版本 display:-webkit-box;
7.1 开始支持标准版本 display: flex;
PC
如果你不需要兼容ie10以下版本,也是可以使用flex.css
flex.css同时能兼容新版本和旧版本,保证了浏览器不支持新版本时,回退到旧版本。
手机预览