我如何创建一个流畅的图像，但宽高比由我决定？ (比方说 16:9)
我已经使用 max-width: 100%; 使其流畅，但我无法更改纵横比。
注意:大多数情况下图像的纵横比不同。
最佳答案
您可以将图像包装在两个容器中。给一个容器 height:0 和一个 padding-top，其中包含您希望图像高度与宽度成比例的百分比。因此，对于宽度的 50% 的高度，使用 padding-top:50% 和 height:0，如 here 所述- 将使高度与宽度成比例 50%。
.wrapper {padding-top:50%;height:0;position:relative;}
在该容器内，您放置另一个具有以下样式的容器:
.inner{position:absolute;left:0;top:0;right:0;bottom:0;}
现在只需将您的图像放在内部容器中并为其指定 width:100% 和 height:100%
参见 fiddle :http://jsfiddle.net/henrikandersson/PREUD/1/ (更新了 fiddle )
关于Css改变流体图像的纵横比，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11399194/