CSS图像高度自动导致不正确的宽高比

Question

我遇到这个非常奇怪的问题...

我的图片尺寸为：570x400。我有这个构建响应，所以为了缩小图像我正在使用： img {max-width：100％;高度：汽车;}

这很有效...但是当我达到最大尺寸时，由于某种原因，图像显示在：570x406。这就像是不正确地计算宽高比。

以下是我正在处理的网站： http://www.juliancaustrita.com/

之前有没有遇到过这个？我使用“max-width 100％; height：auto”构建了许多站点，之前从未见过这个....

谢谢！

Answer 1

这是因为您正在应用.img-frame的10px白色边框。

Answer 2

CSS宽度包括填充和边框。您在图像上应用的类.img-frame为它们提供了10px的边框。

Chrome的元素检查器的屏幕截图可能会让事情变得更加清晰：