当前位置: 芃睿知识网 > 建站问题

CSS实现图片大小自适应代码(非常实用)

知识网2022年02月20日 02:38原创

图片自适应图片出现变形解决代码:

html:

<img src=&...& class=&img-responsive& alt=&响应式图像&>

CSS实现图片大小自适应代码:

.img-responsive {

display: inline-block;

height: auto;

max-width: 100%;

}

(1)display:inline-block元素相对于它周围的内容以内联形式呈现,但与内联不同的是,这种情况下我们可以设置宽度和高度。

(2)height:auto,相关元素的高度取决于浏览器。

(3)max-width:100%会重写任何通过width属性指定的宽度。这让图片对响应式布局的支持更友好。

本文章网址:https://www.shsongjiang.com/p85/

很赞哦!(8)

发表高见 (请对您的言行负责)
2022年02月20日 02:40,回答 by_淘气宝宝:
确实很实用,代码直接就可以复制到实战项目中,这才是我们想要的

©芃睿知识网 版权所有 2012-2022 www.shsongjiang.com

备案号:赣ICP备2022001527号-1