跨浏览器的字体大小一致(Web 开发)

发布于 2024-07-13 03:17:42 字数 272 浏览 5 评论 0原文

在创建网页时,我们如何实现跨浏览器的字体大小一致。 我在 CSS 中使用了类似 "font-size: 11pt; font-family: Helvetica,'Lucida Grande'" 的内容,但文本在 Firefox、IE、Google Chrome 和 Safari(以及这甚至不在不同的平台上)。 基本上在运行 Windows Vista 的同一台计算机上,我在不同的浏览器下获得不同的外观和感觉。

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

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.

How can this be fixed so that the size of text appears same on all the different browsers.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(5

情话已封尘 2024-07-20 03:17:42

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

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

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

You will want to use a CSS Reset to attempt to get consistent behavior across all browsers.

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

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

擦肩而过的背影 2024-07-20 03:17:42

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

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

Use px (pixels) instead of pt (points) for your font size units. Then you'll be dealing with pixel sizes.

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.

萧瑟寒风 2024-07-20 03:17:42

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

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

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

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

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 ‘%’.

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.

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.

潜移默化 2024-07-20 03:17:42

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

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

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

测试:IE9、Firefox、Google Chrome

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

韬韬不绝 2024-07-20 03:17:42

这是一个非答案,因为有很多方法可以实现您所需要的,但我不太熟悉它们。 从 blueprint 等框架通常提供的“重置”开始,然后从那里开始。

让设计足够灵活通常会更容易、更明智,这样浏览器之间的微小差异就不会产生太大的影响。

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 blueprint usually 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.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文