如何让图片自适应容器宽度并保持原有比例？

从现在开始，我们要努力学习啦！今天我给大家带来《如何让图片自适应容器宽度并保持原有比例？》，感兴趣的朋友请继续看下去吧！下文中的内容我们主要会涉及到等等知识点，如果在阅读本文过程中有遇到不清楚的地方，欢迎留言呀！我们一起讨论，一起学习！

图片宽高自适应难题

你想让图片自适应容器宽度，同时保持原有高宽比。但当前实现下，图片总失真。下面提供一个解决方案：

样式如下：

<div   style="max-width:100%">
  <img src="/seller/templateshttps://segmentfault.com/img/bg_logo_left.png" alt="" style="width: auto; height: 100%;">
</div>

具体说明：

• width: auto;：允许图片在容器内自由伸缩。
• height: 100%;：强制图片高度等于容器高度，保持原有高宽比。

现在，图片将根据容器宽度自适应，并保持其原始比例，避免失真问题。

好了，本文到此结束，带大家了解了《如何让图片自适应容器宽度并保持原有比例？》，希望本文对你有所帮助！关注golang学习网公众号，给大家分享更多文章知识！