- Objective: - Breadcrumb: # 概念阐释 ## 语义 **`flex-shrink`** 属性指定了 flex 元素的收缩规则。flex 元素仅在默认宽度之和**大于容器container**的时候才会发生收缩，其收缩的大小是依据 flex-shrink 的值。 ## 语法 ```css flex-shrink: 2; ``` - 1为初始值 - 0为不收缩，溢出盒子 - 值越大收缩越多 # 实例 将item收缩回容器，并让1收缩的比2更多。盒子宽度为250px。 *注意item的html属性写法和item宽度的css属性是什么？* ![](http://image.sentinel-china.com/2023-03-14-IMG_1630.PNG) ![](http://image.sentinel-china.com/2023-03-14-IMG_1628.PNG) ![](http://image.sentinel-china.com/2023-03-14-IMG_1629-1.PNG) # 相关内容 # 参考资料 [MDN-flex-shrink](https://developer.mozilla.org/zh-CN/docs/Web/CSS/flex-shrink)