<div class="parent">
<div class="item-1"></div>
<div class="item-2></div>
<div class="item-3"></div>
</div>
.parent {display: flex;width: 600px;}
.parent > div {height: 100px;}
.item-1 {width: 140px;flex: 2 1 0%;background: blue;}
.item-2 {width: 100px;flex: 2 1 auto;background: darkblue;}
.item-3 {flex: 1 1 200px;background: lightblue;}
总基准数 0%+auto+200=300 ( 0%:0 auto对应width:100） 即item1:0 item2:100 item3:200
剩余大小600-300=300
放大系数：2+2+1=5 即item1:120 item2:120 item3:60
则 item1:120 item2:220 item3:260
网友评论