网站首页编程语言正文

max-width: 100%和width:100%的区别

作者：草样的年华更新时间： 2022-06-06 编程语言

比如我们要设置一个图片

img { max-width: 100%;}，img { width: 100%;}，

max-width：就是要保证图片最大显示为其自身的100%(即最大只可以显示为自身那么大)。此时，如果包含图片的元素(比如包含图片的body或div)比图片固有宽度小，图片会缩放占满最大可用空间。

width:100%：要实现图片的自动缩放，也可以使用更通用的 width 属性。然而，这条规则会导致它显示得跟它的容器一样宽。在容器比图片宽得多的情况下，图片会被无谓地拉伸。

原文链接：https://blog.csdn.net/qq_42690194/article/details/120735385