专业编程教程与实战项目分享平台

网站首页 > 技术文章 正文

图片自适应黑科技

ins518 2024-11-22 15:46:53 技术文章 8 ℃ 0 评论

经常碰到图片的自适应问题，在不同屏幕上展示的效果不一致的问题。在一个相对屏幕某个大小容器内，譬如容器的宽度是屏幕的80%，期望图片自适应展示效果

  1. 上面的方式，通过padding-bottom实现，padding-bottom的值是（高*100/宽）%，background-size:contain，能满足宽按照容器100%，高自适应展示，效果如下图2 的效果<img src="" width="100%" />

Tags：

猜你喜欢

本文暂时没有评论，来添加一个吧(●'◡'●)

欢迎 你 发表评论:

最近发表
标签列表