21

在创建网页时,我们如何在浏览器中实现一致的字体大小。我"font-size: 11pt; font-family: Helvetica,'Lucida Grande'"在我的 CSS 中使用了类似的东西,但是文本在 Firefox、IE、Google Chrome 和 Safari 中看起来不同(甚至在不同的平台上也没有)。基本上在同一台机器上,即运行 Windows Vista,我在不同的浏览器下得到不同的外观和感觉。

如何解决此问题,以使文本的大小在所有不同的浏览器上显示相同。

4

5 回答 5

16

您将需要使用 CSS 重置来尝试在所有浏览器中获得一致的行为。

http://meyerweb.com/eric/tools/css/reset/

http://developer.yahoo.com/yui/reset/

于 2009-02-06T19:40:34.030 回答
8

使用 px(像素)而不是 pt(点)作为字体大小单位。然后你将处理像素大小。

但是请注意,这取决于您的网站的使用方式。(在美国)因“硬编码”字体大小而导致网站上的可访问性问题存在诉讼。

于 2009-02-06T19:40:31.940 回答
7

创建网页时,我们如何在浏览器中实现一致的字体大小

对于正文,您不需要。有些人想要更大的文本,以便他们可以更轻松地阅读;妨碍他们,后果自负。使用以“em”或“%”为单位的相对字体大小。

对于需要文本大小以匹配像素大小的屏幕元素的少量演示文本,请使用“px”单位。不要使用 'pt' - 这仅对打印有意义,在屏幕上查看时它会或多或少地随机调整大小。

您仍然无法获得完全相同大小的文本,因为不同平台的字体不同——当然,Lucida Grande 和 Helvetica 看起来也大不相同。

于 2009-02-06T19:42:07.803 回答
3

通过这两个设置,您可以获得完全相同的字体外观:

font-size: 70%; // better than px

line-height: 110%; // required to make line heights the same

测试:IE9、火狐、谷歌浏览器

于 2012-12-02T12:50:13.227 回答
1

这是一个非答案,因为有办法实现你所需要的,但我不太精通它们。从蓝图等框架通常提供的“重置”开始,然后从那里开始。

让设计足够灵活通常更容易和更聪明,这样浏览器之间的微小差异就不会发挥太大的作用。

于 2009-02-06T19:41:03.593 回答