flex: 1的写法

代码示例：

<div class="container">
	<div class="div">我是一个div</div>
	<div class="div">我是一个很多字div</div>
	<div class="div">我是一个更多字而且第三个div</div>
</div>
 
.container {
	display: flex;
}
.div {
	border: 1px solid red;
	flex: 1; 
}

参数：

第一个参数是flex-grow，定义了项目的放大比例，默认是0

第二个参数是flex-shink,定义了项目的缩小比例，默认是1

第三个参数是flex-basis,给上边两属性分配剩余空间时，计算项目是否有多余空间，默认是auto

flex常见使用方法：

flex: none; 等价于flex: 0 0 auto;

flex: auto; 等价于flex: 1 1 auto;

flex: 1;    等价于flex: 1 1 0%;  值为非负数字，该值设置的是flex-grow。

flex: 1 0;  等价于flex: 1 0 0%;  相当于设置的flex-grow和flex-shink,flex-basis的值为初始值。

flex: 1 20%;等价于flex: 1 1 20%; 值为一个数字和一个长度或百分比时，设置的是flex-grow和flex-basis，flex-shink的值为初始值。