Html 如何使用css设置缩放级别
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3302988/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to set zoom level using css
提问by prat
I have been developing my webapp with a certain zoom level on firefox that I set initially (using ctrl+wheel). Now when tested on a different PC on firefox, the default 100% seems to be too big. Can I set default using css?
我一直在我最初设置的 firefox 上开发具有特定缩放级别的 web 应用程序（使用 ctrl+wheel）。现在，当在 Firefox 上的另一台 PC 上进行测试时，默认的 100% 似乎太大了。我可以使用 css 设置默认值吗？
采纳答案by Peter Ajtai
What DA said, zoom is a user controlled setting, but you can size things relative to the zoom, and if users don't use Ctr + - to size, but change the sizing by setting a default font size, you can can over-ride this default setting by setting a font-size in pixels (as opposed to ems, %, etc.).... This however, is generally considered bad practice, since it may make the lettering / sizing illegible and unchangeable to some people, who don't know about Ctr + - and rely on a default font size.
DA所说的，缩放是用户控制的设置，但是您可以相对于缩放来调整大小，如果用户不使用 Ctr + - 来调整大小，而是通过设置默认字体大小来更改大小，则可以过度-通过以像素为单位设置字体大小（而不是 em、% 等）来使用此默认设置。...然而，这通常被认为是不好的做法，因为它可能会使字体/大小难以辨认并且对某些人来说无法更改，谁不知道 Ctr + - 并依赖默认字体大小。
You can adjust sizing relative to the user defaults and zoom setting by setting the font-size in ems or %. This will change the sizing of things relative to the user set sizing.
您可以通过以 em 或 % 为单位设置字体大小来调整相对于用户默认值和缩放设置的大小。这将更改相对于用户设置大小的事物的大小。
This enables you to make each page look to another person how it looks to you.... since each person's perception of "small," "medium," and "large" is different.
这使您能够使每个页面在另一个人看来与您在您眼中的样子一样......因为每个人对“小”、“中”和“大”的看法是不同的。
回答by zach
<html>
<body>
<div id="sampleDiv" style="width: 100px; background-color: Gray;">
Zoom Me
</div>
<button onclick="sampleDiv.style.zoom='300%'">Zoom 300%</button>
<button onclick="sampleDiv.style.zoom='200%'">Zoom 200%</button>
<button onclick="sampleDiv.style.zoom='100%'">Zoom 100%</button>
</body>
</html>回答by DA.
The page zoom is a browser feature, not a CSS setting (well, except for that IE proprietary thing, which is really more useful for fixing IE bugs than anything) so it is a user-controlled variable rather than anything you have control over.
页面缩放是浏览器功能，而不是 CSS 设置（嗯，除了 IE 专有的东西，它对于修复 IE 错误比任何东西都更有用）所以它是一个用户控制的变量，而不是你可以控制的任何东西。
回答by ???? ?????
You can set the zoom using the CSS property zoom. It's an old IE thing which is also supported in Chrome, and Safari.
您可以使用 CSS 属性设置缩放zoom。这是一个旧的 IE 东西，Chrome 和 Safari 也支持它。
.zoom
{
zoom: 120%;
}
However, this probably shouldn't be used on live sites...
但是，这可能不应该在实时站点上使用...
