控制宽度和高度为身体的图像宽高比

我在我的网站上出现了这两个图像，我从另一家公司的服务器上拉出。我需要这些照片来与浏览器窗口进行比例缩放，所以我给了它们一个％宽度和高度来与正文一起缩放。控制宽度和高度为身体的图像宽高比

问题是这些图像中的一些是不同的大小，我需要所有的图像看起来完全相同。当我知道图像宽度和高度的值时，这很容易实现，因为我可以裁剪或调整大小。但是，如何保持可伸缩宽度和高度的比例？

我认为需要一些JavaScript来做到这一点。这里是我有的CSS：

html { 
    width: 100%; 
    height: 100%; 
} 
body { 
    width: 100%; 
    height: 100%; 
    margin: 0px; 
    padding: 0px; 
} 
.image { 
    width: 40%; 
    height: 40%; 
    margin: 1%; 
}

来源

2012-10-17 AzzyDude

图像是混合方向还是横向或纵向？通常情况下，您可以将宽度或高度设置为百分比，并将其他设置为自动，但混合方向需要将类附加到图像上，以识别它是哪一个。 – cimmanon

他们都将是风景。只是高度有些波动，所以看起来不合格。 – AzzyDude

只用CSS做它会花你很多时间来优化所有brosers。

，你可能使用Perfect background image

来源

2012-10-17 12:56:32 easwee

如果你不关心IE8实现这一目标进行一些修改和JS，你可以指定width。大多数浏览器会为你保持高宽比。

来源

2013-05-15 22:35:46

控制宽度和高度为身体的图像宽高比

回答

相关问题