如何防止html/css上的文本大小增加

this website looks very nice, although the've managed to prevent the user to increase/decrease the font size through the browser facility.

这个网站看起来很不错，尽管他们已经设法阻止用户通过浏览器工具增加/减少字体大小。

http://simplegeo.com/

http://simplegeo.com/

If you check the Zoom Text Only option on your browser and try to zoom in or zoom out (usually ⌘+ / ⌘- or ctrl+ / ctrl-) you can see that the font-size doesn't change.

如果你检查浏览器缩放文本唯一的选择和尝试放大或缩小(通常⌘+ /⌘——或者ctrl + / ctrl -)可以看到,字体大小不会改变。

How can I replicate the same effect?

我如何复制同样的效果?

I am thinking that this would be nice to prevent items from menu or purely layout based elements and leave only the main text be affected.

我认为这将是很好的防止项目从菜单或纯粹的布局基础上的元素，只留下主要的文本受到影响。

2 个解决方案

#1

From looking at their CSS, it might be this line of code: -webkit-text-size-adjust:none; If so, it'd only work in a limited number of browsers, not everywhere.

从他们的CSS来看，可能是这一行代码:-webkit-text-size- adjustment:none;如果是这样的话，它只能在有限的浏览器中运行，而不是在所有的浏览器中。

There's not much reason you should be preventing users from adjusting text size, though. Yes, it might cause problems with the design, but you could also argue that the design should be flexible enough to deal with font size changes.

不过，您不应该阻止用户调整文本大小。是的，它可能会导致设计上的问题，但是您也可以认为设计应该足够灵活，以处理字体大小的变化。

Comedy option: replace all your text with images.

喜剧选项:用图片替换所有的文字。

#2

Use the following CSS code.

使用以下CSS代码。

<style type="text/css">
-webkit-text-size-adjust:none;
-ms-text-size-adjust:none;
-moz-text-size-adjust:none;
text-size-adjust:none;
</style>

#1