Question

可能重复：
Allow users to change font size in a webpage

您好，

我有一些网页。我希望用户点击图片，并使页面上所有内容的字体大小增加。这可能吗？如果是这样，怎么样？

我知道浏览器里面有选项。基本上，我想在页面本身中做到这一点。

谢谢。

Answer 1

实现这一目标的三件事：

在<body>标记中指定整体字体大小。例如：

body { font-size: 100%; }

请勿使用像素在文档中的任何其他位置指定font-size。

p.somePara { font-size: 120%; }
p.anotherPara { font-size: 1.4em; }

将事件处理程序附加到此图像，以相应地调整字体大小。使用jQuery，例如：

$("#largerTextImage").click(function() {
  $("body").css("fontSize", "120%");
});

完成。

Answer 2

如果增加像<body>这样的顶级元素的字体大小，那么[更改]大小将由其子元素继承（假设这些元素的其他CSS规则未覆盖该大小具有绝对值，这也会弄乱用户在浏览器中更改字体大小。）

This article（例如）说它描述了如何以编程方式更改CSS值。

Answer 3

我会说你可以切换css。

将所有字体大小放在单独的CSS文件中。然后复制此文件并更改字体大小。然后使用一段js脚本来切换css文件。

有很多教程可以解释它的全部内容。 Here's one