如何使用CSS缩放整个网页?

198

使用Firefox浏览器,您可以通过按下CTRL +键来放大整个网页。这样做会比例放大整个网页(包括字体、图片等)。

如何只使用CSS复制相同的功能?

是否有类似于page-size: 150%的东西(它会将整个页面部分增加x%?)


7
Firefox的页面缩放功能在每个现代浏览器中都出现了 - 复制它似乎相当无意义。 - Quentin
1
我同意David的观点。因为现在的浏览器都有这个功能,所以复制这个功能似乎有点毫无意义... - user
6
对于移动设备来说,这个功能实际上会非常有用。许多手机现在增加了它们的像素密度,但并没有适应这种差异(当然,iPhone4除外)。 - DA.
46
它并不是在复制它。它可能对于嵌入式 div 中的页面/元素预览很有用。 - RichieHH
3
页面设计者应该能够为自己的页面设置默认缩放比例。我有一个在制作时很大,但现在因高分辨率显示器而变小的页面:http://www.lonniebest.com/CardTrick/ 。我不想重新制作这个页面,而是希望通过默认缩放来实现。 - Lonnie Best
不是完美的解决方案,但使用 em 作为您的度量单位。事物开始相对于它们的父级进行缩放(改变主体的大小,一切都会自动适应)。要获得更加“有趣”的结果……使用 cm 作为您的度量单位,尽管移动设备似乎会将其大小减半。 - Jefferey Cave
12个回答

1

CSS 无法按需缩放,但如果将 CSS 与 JS 结合使用,您可以更改一些值以使页面看起来更大。 然而,正如已经说过的那样,现代浏览器中这个功能已成为标准:不需要复制它。事实上,复制它会减慢您的网站(更多的东西要加载,需要解析或执行和应用更多的 JS 或 CSS 等等)


这是一个标准的浏览器功能,但是将该功能直接添加到网站中意味着您不必依赖于(1)用户对其选择的浏览器的专业知识和(2)特定于浏览器的说明。 - Ags1

1
 * {
transform: scale(1.1, 1.1)
}

this will transform every element on the page


看起来对我已经解决了。 - plugincontainer

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接