max-width的继承方式的问题?

max-width的继承方式的问题?

我看到老师里面写了max-width:100%然后图片最大宽度就是图片本身。然而width:100%是整个游览器宽度。


max-width:100%中100%如果继承的父级应该也是游览器的宽度吧也就是最大宽度不能超过游览器的宽度应该也是占满呀。但是为什么是图片的最大宽度呢


另外我更多看到的是width和max-width结合使用。在只设置max-width的时候他的原始宽度会是多少

正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

2回答
好帮手慕慕子 2022-02-08 11:49:56

同学你好,对于你的问题解答如下:

1、max-width和width属性都不具有继承性,设置的百分比是根据祖辈元素设置的宽度进行计算的。

2、给img标签设置的max-width:100%;是指图片的最大宽度,但是并没有设置width属性指定图片的宽度是多少,所以最终图片默认以自身宽度显示

3、一般是width结合max-width使用,在没超过max-width属性值时,元素宽度以width属性值为准,超过后,元素宽度以max-width属性值为准,防止元素超出。

只设置max-width的时候,参考第二条解释,此时元素的width默认是auto,所以原始宽度也就是元素内容的宽度

祝学习愉快~

  • 老师,这里只设置max-width,不设置width,如果元素小于max-width,元素能随着屏幕变化,是什么原因呢?元素应该默认是自己本身大小吧,这里不理解

    2022-03-27 15:35:16
  • 同学你好, 针对块级元素,默认是填充满父元素,假设它的父元素是body,只设置max-width,不设置width,那么宽度小于max-width时,元素会随着屏幕宽度变化,超出max-width,元素宽度以max-width显示。

    祝学习愉快~

    2022-03-27 15:54:45
慕先生3038079 提问者 2022-02-08 11:48:56

哦哦知道了,div,body这些都是默认有宽度的,img也有默认的图片的宽度 。max-width是对于自身的宽度。

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师