- 如果项目使用构建工具,可加autoprefixer来处理,[autoprefixer使用指南]
- 纯手写css兼容代码,需给每个使用的属性加上属性前缀
/*display: flex;写法*/ span { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } /*justify-content: center*/ span { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } /*align-items: center*/ span { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } /*flex: 1*/ span { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: block; 0%; }
注意:给flex添加前缀并不是万能的,其原因是不能用行内元素,要改成block才能更好的支持flex,当元素使用flex:1时,要增加0%; 且不能使用margin:0 auto;