flex-shrink 计算公式

box-shrink:(每个盒子的宽度 x box-shrink所占比例) ÷ (每个盒子的宽度 x box-shrink所占比列 相加 之和 ) × 多出来的剩余空间
以下例子:

.wrapper {
             600px;
            height: 300px;
            display: flex;
    }

.wrapper .content {
             200px;
            height: 100px;
            box-sizing: border-box;
            flex-grow: 1;
    }

.wrapper .content:last-of-type {
             400px;
            flex-shrink:4;
    }
<div class="wrapper">
        <div class="content">1</div>
        <div class="content">2</div>
        <div class="content">3</div>
</div>
我可以得出前两个div所压缩比例空间:
200*1 + 200*1 + 400*4=2000;

//计算前两个div压缩值
200*1
------- * 200= 20   压缩值20
2000

//计算最后一个div压缩值
400*4
------- * 200 =160 压缩值 160
2000


得出:
    第一个div和第二个div的宽度为180  
    低三个div为宽度为 400-160=240
    


```1.
原文地址:https://www.cnblogs.com/pengyinghao/p/13287967.html