如何在使用transform:scale时填充屏幕，而不是在屏幕上居中并周围有空白？

Question

我想使用以下代码将页面缩放至 65%，但它在 iOS 版 Safari 上不起作用：

body {
    zoom: 0.65;
}

所以我使用这个代码：

body {
    -webkit-transform: scale(0.65, 0.65);
    transform: scale(0.65, 0.65);
}

但是，它使页面出现在屏幕中间，每侧周围都有一堆空白：

如何让页面占满整个屏幕？

Answer 1

将 CSS 更改为：

body {
    -webkit-transform: scale(0.65, 0.65);
    transform: scale(0.65, 0.65);
    transform-origin: top left;
    height: calc(100% / 0.65) !important;
    width: calc(100% / 0.65) !important;
}

页面现在将以 65% 的缩放级别填满屏幕。

calc

的详细信息可以在这个堆栈溢出问题中找到。