flex低版本的兼容

在一些旧的版本上，display：flex的使用，还是有限制，导致页面效果崩坏

例如：

flex控制布局占位

正确兼容：

1.对定义display:flex;的元素

display:-webkit-box;

display:flex;

display:-webkit-flex;

display:-ms-flexbox;

-webkit-box-align:center;

-webkit-align-items:center;

align-items:center;

2.对定义flex：1的元素

-webkit-box-flex: 1;

-webkit-flex: 1;

-ms-flex: 1;

flex: 1;

原理：

低版本的flex效果沿用box的属性

注意：

display:-webkit-box;是需要额外增加属性，是不同版本对css1，css2，css3生效不生效的兼容处理

而flex的前缀-wibkit-之类，是对内核处理同种属性时的兼容处理，在sass编译的时候，能够自动添加，普通css文件需要手动罗列，需要根据开发文件的安排，自定义选择