max-width

 

解释max-width: 100%; 实际上是在父盒子的宽度变大时，使得里面的 img 元素也会相应地变大，以适应父盒子的宽度。这会确保图片不会超过其父元素的宽度，从而保持布局的一致性和合理性。

所以，当父盒子的宽度增加时，应用了 max-width: 100%; 的 img 元素会相应地跟随父盒子的宽度增加，但不会超过父盒子的宽度。这有助于创建响应式布局，使图片能够根据不同设备和屏幕大小进行自适应调整。感谢您的澄清，希望这次的解释更清楚明了。

/*一个盒子里面装一张图片*/
.header img {
    background-color: blue;
    max-width: 100%;/*设置图片最大宽度 ，父盒变大 图片自适应变大  */
    /* width: 100%; */
}