Javascript 将网页缩小到90%

在任何浏览器上按Ctrl+

-

时，页面将缩小到其原始大小的90%。我需要复制它，并在默认情况下以90%的原始值打开我的网页，而不是100%，因为它在90%时看起来更好

我尝试了前面提到的最常用的方法，所有这些方法基本上都告诉您在

css

中添加这段代码

html
{
    zoom: 0.9; /* Old IE only */
    -moz-transform: scale(0.9);
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
}

这样做的问题是，它会在左右两侧产生一个间隙，在顶部产生一个巨大的间隙，当您通过执行

ctrl

+

-

手动减小尺寸时，这种间隙是不存在的

这就是我使用上述代码时所发生的情况——请注意左侧、右侧和顶部的间隙。

虽然这是我想要的-这是当您在浏览器中手动执行

ctrl

+

-

时发生的情况。

我该怎么办

---

编辑：正如Jonathon在评论中所说，如果我的页面在90%的时候看起来更好，我应该这样设计，而不是缩小规模。问题是我使用的是90%，而不是100%。

您需要在CSS中使用/转换为相对单位。%或em或rem

然后，在主体级别，您可以设置一个绝对大小，从而使相对度量值重新计算为您想要的值

如果您仅使用em或ex： 您声明字体大小：body为90%，您可以动态调整

---

所有这一切都取决于你选择的单位，使它们成为相对的单位将允许你现在寻找的那种自由。

也许你可以用页边顶部：-50px；对于特定的元素。

可能不是您想要听到的，但是如果您的页面在90%时“看起来更好”，您应该将其设计为100%。你真的不应该这样胡闹用户的偏好。哈哈@Jonathan，没错。但现在我正在使用这个标准模板——我喜欢它在90%和100%之间的表现。你知道我该怎么做吗？@RandomlyNamedUser你需要修改模板。尝试手动缩放内容不太可能获得精确匹配-缩放输出时，浏览器渲染将发生变化。你真的需要浏览CSS，让它与90%匹配，仅仅使用html{zoom:.9}似乎是可行的！（虽然zoom是ie特有的，transform是新的）@radiant，谢谢，它是：）但这只适用于chrome和ie，我需要使我的代码浏览器独立。请注意，基于em的媒体查询不会使用您设置的基本大小，而是使用用户设置的基本大小。