就在前一天还这么简单，但我想不通：
如何在页面上将图像居中，为其提供固定的 % 边距（所有边均为 10%），并且在调整大小时仍使其随窗口缩放？
页面和图片在所有平台上都能很好地显示，没有滚动条 (!)，这一点非常重要。 页面本身非常简单，只包含图像（在不同版本的页面上具有不同的尺寸），顶部有一个栏，带有将其发送到另一个页面的链接。
图片的最大尺寸为 1500x1000px，没有最小尺寸。
我衷心希望有人能帮助我解决这个问题，非常感谢！
【问题讨论】：
标签： image centering margins resizable
最好的方法是使用 JavaScript。获取窗口大小，订阅 window.onresize 事件并相应更新图像大小和位置。
仅使用 CSS 是行不通的，因为任何位置属性都依赖于容器。在您的情况下，容器是窗口，它将根据内容自行调整大小。这会产生一种循环依赖（窗口大小取决于图像，图像大小和位置取决于窗口大小）。
有关以跨浏览器方式获取确切可用窗口大小的信息，您可以查看此帖子：Get the size of the screen, current web page and browser window - 有一段时间没有这样做了，以便为您提供准确的代码。
另请注意，您没有提到保持图像的纵横比。如果不应该维护，则无法仅使用 HTML/CSS，因为所有使用它们的操作都会维护图像的 AR。
【讨论】：