这让我发疯。在我的 CSS 中是这段代码
img {max-width:100%; height:auto; }
但是当我将 200x200 的图片上传到博客文章时
<img width="200" title="photo-Trent-Dysmid.jpg" style="width: 200px; float: right;" alt="photo-Trent-Dysmid.jpg" src="http://inboundmarketing.digitalhive.buzz/hubfs/jan-2016-images/photo-Trent-Dysmid.jpg" data-constrained="true">
然后预览博客文章，它以 798x798 的分辨率发布，基本上是博客页面的整个宽度。我可以让它以正确的尺寸显示的唯一方法是手动将“宽度:200px”更改为“最大宽度:200px”，但每次都必须这样做是多么麻烦!我做错了什么？
谢谢! 丽贝卡
最佳答案
最大宽度:100%
百分比值将引用 img 元素所在容器的宽度，而不是图片本身!
例子:
<div style="width: 500px"><img src="..." style="max-width: 100%" /></div>
因此，如果容器的宽度为 500px，则 img 元素的最大宽度也将为 500px
您可以使用 JavaScript 和 image.onload 事件设置适合图像的自定义最大宽度:
<img onload="this.style.maxWidth = this.width + 'px'" src="..." />
关于html - Img 设置为最大宽度 : 100% is publishing larger than the actual image size?，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34657686/