flex定宽的原理(flex:1的作用)

我认为给子元素定属性 flex：1 (前提是父容器要是flex布局)

这个定了flex为1的子元素的宽度计算为

width= $\frac{fatherWidth-没有定flex为1的所有元素的宽度和}{flex为1的元素的个数}$

给个简单例子看看

比如左边定宽，右侧自适应

		#div1 {
			display: flex;
			height: 100px;
			width: 100px;
			background-color: red;
			margin: 200px auto;
		}
		.d1{
			width: 80px;
			height: 100px;
			background-color: #0077AA;//蓝色
		}
		.d2{
			flex: 1;
			height: 100px;
			background-color: #008000;//淡绿色
		}

	<div id="div1">
		<div class="d1"></div>
		<div class="d2"></div>
	</div>

效果如下