CSS 跨浏览器的一致字体大小（Web 开发）
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/521832/
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
Consistent font-size across browsers (web development)
提问by user63468
When creating web pages how do we achieve a consistent font size across browsers. I have used something like "font-size: 11pt; font-family: Helvetica,'Lucida Grande'"in my CSS, but the text looks different in Firefox, IE, Google Chrome and Safari (and this is not even on different platforms). Basically on the same machine, that is running Windows Vista, I get a different look and feel under different browsers.
在创建网页时，我们如何实现跨浏览器一致的字体大小。我"font-size: 11pt; font-family: Helvetica,'Lucida Grande'"在我的 CSS 中使用了类似的东西，但文本在 Firefox、IE、Google Chrome 和 Safari 中看起来不同（这甚至在不同的平台上都没有）。基本上在运行 Windows Vista 的同一台机器上，我在不同的浏览器下获得不同的外观和感觉。
How can this be fixed so that the size of text appears same on all the different browsers.
如何解决这个问题，以便文本的大小在所有不同的浏览器上显示相同。
采纳答案by David Morton
Use px (pixels) instead of pt (points) for your font size units. Then you'll be dealing with pixel sizes.
使用 px（像素）而不是 pt（点）作为字体大小单位。然后你将处理像素大小。
Beware however, depending on how your site is used. There have been lawsuits (in the US) over accessibility issues on websites that result from "hard-coding" the font size.
但是要注意，这取决于您的网站的使用方式。由于“硬编码”字体大小而导致网站上的可访问性问题（在美国）已经有过诉讼。
回答by VBNight
You will want to use a CSS Reset to attempt to get consistent behavior across all browsers.
您将需要使用 CSS 重置来尝试在所有浏览器中获得一致的行为。
http://meyerweb.com/eric/tools/css/reset/
http://meyerweb.com/eric/tools/css/reset/
回答by bobince
When creating web pages how do we achieve a consistent font size across browsers
创建网页时，我们如何实现跨浏览器一致的字体大小
For main body text, you don't. Some people want bigger text so they can read it more easily; get in their way at your peril. Use relative font sizes in units such as ‘em' or ‘%'.
对于正文，您不需要。有些人想要更大的文本，以便他们更容易阅读；妨碍他们对你的危险。以“em”或“%”等单位使用相对字体大小。
For small amounts of presentational text where you need text size to match pixel-sized on-screen elements, use the ‘px' unit. Don't use ‘pt' - that only makes sense for printing, it'll resize more-or-less randomly when viewed on-screen.
对于需要文本大小以匹配像素大小的屏幕元素的少量展示文本，请使用“px”单位。不要使用 'pt' - 这仅对打印有意义，在屏幕上查看时它会或多或少随机调整大小。
You can still never get the text exactly the same size because fonts differ across platforms—and Lucida Grande and Helvetica look very different of course.
您仍然无法获得完全相同的文本大小，因为字体因平台而异——当然，Lucida Grande 和 Helvetica 看起来非常不同。
回答by Antaran
With these two settings, you can reach exact same font appearance:
通过这两个设置，您可以获得完全相同的字体外观：
font-size: 70%; // better than px
line-height: 110%; // required to make line heights the same
Tested: IE9, Firefox, Google Chrome
测试：IE9、火狐、谷歌浏览器
回答by rz.
This is a non-answer, as there are ways to achieve what you need, but i'm not too well-versed in them. Start with the "reset" that frameworks like blueprintusually provide and go from there.
这是一个非答案，因为有多种方法可以实现您的需求，但我不太精通它们。从蓝图等框架通常提供的“重置”开始，然后从那里开始。
It is usually much easier and smarter to have designs be flexible enough so that the small differences across browsers don't play too big a role.
让设计足够灵活通常更容易和更聪明，这样浏览器之间的微小差异就不会发挥太大的作用。
