在CSS弹性布局中，flex-shrink和flex-grow这两个属性的初始设定值分别是多少，它们各自在布局中承担怎样的职责？

回答思路

1. 【回答框架 1】flex-grow的默认值是0，表示当容器有剩余空间时，项目默认不会放大；flex-shrink的默认值是1，表示当容器空间不足时，项目默认会按比例缩小。
2. 【回答框架 2】flex-grow的作用是定义项目在主轴方向上有多余空间时如何分配这些空间，数值越大，分配到的额外空间比例越高，数值为0则完全不放大。
3. 【回答框架 3】flex-shrink的作用是定义当容器空间不足以容纳所有项目时，各项目如何收缩，数值越大，收缩越多，数值为0则项目保持原尺寸不缩小，可能导致溢出。
4. 【回答框架 4】这两个属性通常与flex-basis配合使用，组成flex简写属性，共同决定项目在主轴上的尺寸分配策略。默认情况下，项目会保持其基础尺寸，在空间充裕时可能被拉伸，在空间紧张时可能被压缩。
5. 【关键点 1】flex-grow默认值为0，flex-shrink默认值为1。
6. 【关键点 2】flex-grow分配剩余空间，flex-shrink分配不足空间，二者均基于比例进行分配。
7. 【关键点 3】flex-shrink为0时项目不缩小，可能溢出容器。
8. 【易错点 1】容易混淆两者的默认值，误将flex-grow记为1。
9. 【易错点 2】忽略flex-shrink的默认行为，以为项目空间不足时默认不缩小。
10. 【易错点 3】将flex-shrink理解为固定宽度不变，实际它受基础尺寸和比例共同影响。