flex兼容问题

display:flex作为C3的新属性,还是有的浏览器不支持的,那下面我们就来说一下他的兼容写法

.box{
	display: -webkit-box; /* 老版本语法: Safari, iOS, Android browser, older WebKit browsers. */
	display: -moz-box; /* 老版本语法: Firefox (buggy) */
	display: -ms-flexbox; /* 混合版本语法: IE 10 */
	display: -webkit-flex; /* 新版本语法: Chrome 21+ */
	display: flex
}

但若是在移动端,我们只要写-webket-的就好了

align-items: center;
-webkit-box-align: center;

flex-direction: column; 
-webkit-box-orient: vertical; 

justify-content: space-between;
-webkit-box-pack: justify;

justify-content: flex-start;
-webkit-box-pack: start;

justify-content: center;
-webkit-box-pack: center;

看到这些应给也就能找到规律了吧。

原文地址:https://www.cnblogs.com/eyed/p/7992667.html