-webkit-box 是-webkit-flex 的旧写法;
-ms代表识别码
-moz代表火狐内核识别码
-webkit代表内核识别码
-o代表欧朋【opera】内核识别码
不写的,是统一标识语句,符合,使用属性时,大部分都要带这些识别前缀,早期点的浏览器才能识别;
不同的写法是对应不同时期的 Flex 规范,强烈建议使用 自动增加前缀,在开发的时候只写标准属性「display:flex」,然后通过插件自动生成前缀。
以下是兼容性写法:
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+ */
图转: