css3中的flex-shrink问题

---

相信学习前端知识的人应该都知道flex-shrink属性，具体的内容我就不在赘述了，就直接放大招吧，上图：

这是咱家在css参考手册上截的一张图，由图可知flex-shrink的用法。但是学无止尽啊，最近在一个视频上了解了有关flex-shrink的更深层次的东西。就用上图的内容举例，如果li的宽度不同呢？嘿嘿，那就不一样了，那该怎么办呢？小老弟先别急，待兄弟我一一道来。
1.用每个li设置的flex-shrink乘以本身的内容区的宽度，注意这里是内容区的宽度，然后再将每个li所求出的这个乘积加起来得到一个综合sum;
2.用li的宽度的总和减去ul的宽度，得出超出部分的宽度w；
3.用li各自的内容区的宽度除以sum再乘以w，就求得li各自应该缩小的宽度了。