【问题标题】：Why would browser text be larger on a particular browser/machine?为什么浏览器文本在特定浏览器/机器上会更大？
【发布时间】：2010-10-15 09:19:16
【问题描述】：

在我做的一个网站上，有人给我发了一张截图，显示我的字幕字体太大。

我在两台机器 (Vista) 上使用 FF、IE6、IE7、IE8、Safari/win、opera/win 检查了该站点。
我可以增加浏览器的字体大小，但字幕保持不变（因为它是 8pt，如下所示），这是我想要的（所以它不会在徽标下方延伸）。
它在http://browsershots.org 处的 34 个浏览器屏幕截图中检查良好。

什么可能导致这个人的机器上的字体变大（Windows XP、IE7）。他说“所有其他网站看起来都很好”。 Windows XP 是否有一些东西可以让操作系统改变浏览器等的字体大小？或者可能是 Windows XP 上的 arial/italic 问题？

这是它的 CSS：

#subtitle {
    position: absolute;
    top: 78px;
    left: 40px;
    width: 738px;
    text-align: right;
    font-size: 8pt;
    font-style: italic;
    font-family: arial;
}

回答：

我将“8pt”更改为“10px”，现在对他有效。我假设他更改了机器上的 DPI。

【问题讨论】：

让他给你发一个网站截图，以及另一个“看起来不错”的网站，比如 news.com 之类的
其他字体大小有问题吗？是否使用“pt”测量定义了其他任何人？
是的，我已经使用 pt 制作固定大小的字体大约 10 年了，没有任何问题。我把它的副标题改成px，让他检查一下。
+1 - 这是一个很好的问题，而且不是那么明显（DPI 设置）。过去我和其他人一样被难住了。一定会喜欢这里显示的答案有多快:)

标签： html css

【解决方案1】：

您使用“pt”作为大小单位。不要那样做。 CSS“物理单位”（pt、mm、in...）仅对物理输出（即打印样式表）有意义。

在屏幕上，使用系统的“dpi”设置将点映射到像素，该设置可以在不同机器上任意变化。 Macs/Windows/Linux 默认都不同，可以重新配置。许多 Windows 用户增加 dpi 设置以调整定点大小的系统对话框 (shell) 字体的大小。

如果您必须对某些文本使用非相对单位，则您需要的单位是“px”。

字体大小可能会发生变化还有其他原因（例如，不同的字体可用性、最小字体大小设置、故意字体缩放），这就是为什么您永远不应该完全依赖它们是您所期望的，但这几乎肯定是原因在这种情况下。

【讨论】：

你会惹恼很多无法缩放的人，尤其是在旧版浏览器上，缩放意味着字体大小而不是整个页面。还有很多在流通。
但在很多情况下您不希望文本扩展，例如如果它覆盖在特定尺寸的图像上
确实，应该谨慎使用固定“px”大小的字体 — 永远不要用于大量正文，但对于应与页面图像匹配的标题、按钮等可能是必需的。

【解决方案2】：

这可能是一个愚蠢的问题，但用户是否无意中更改了浏览器的字体大小？在 IE6 及以上版本中，按住 CTRL 并向前/向后滚动鼠标滚轮将增大/减小字体大小。

【讨论】：

我问过他，他在 IE7 上的 Page, Text Size 下说，它说“Medium”。好的，但是在我的 IE7 上，当我执行 CTRL+ 和 CTRL- 时，它会像扩展图形一样扩展整个站点（有趣的是，这与页面、文本大小不同），在 firefox 上也是如此。

【解决方案3】：

三种可能：

用户已更改其机器的 DPI 设置。在某些版本的 Windows 中，这表现为将字体更改为“大”或“非常大”；
用户已更改其浏览器中的默认字体（例如，从 Tahoma/12 更改为 Firefox 中的 Tahoma/16）；或
用户在其浏览器中禁用了 CSS/HTML 字体大小。这是一个可访问性设置。有些人还会在 15 英寸笔记本电脑上的分辨率为 1920x1200 的情况下使用它，并且一些 Web weenie 已将其网站上的字体大小设置为 8 像素高。

【讨论】：

【解决方案4】：

对不起，bobince 和 Diogenes，但我必须以最强烈的方式不同意你关于不使用 pt 大小并始终使用像素的观点：

希望字体大小与浏览器或操作系统设置中指定的默认大小相对（应该是标准）的设计人员应该使用 % 或时间。想要绝对尺寸（在屏幕上）的设计师应该使用 pt 来保持字体大小不变，而不管屏幕的 DPI 设置如何，原因如下：

现代笔记本电脑和移动设备的屏幕像素密度比台式机高得多，自然（默认）分辨率高达约 150dpi，而台式机的分辨率为 72。医疗和其他专业屏幕甚至更高。并且用户有能力（如果不总是知道的话）提高或降低逻辑 dpi 以根据他的喜好和视力来自定义显示。

任何以像素为单位的图像或文本都太小而无法在高密度 dpi 设备上阅读，这会使您的视力良好的用户感到吃力，并使视力欠佳的用户无法阅读文本。更重要的是（人们可以争论这是否是正确的行为），一些浏览器即使在用户命令时也不会调整像素大小的文本，这使得这种情况无法解决。

与纸张介质不同，纸介质的定位精度可以达到 100 英寸，阅读设计师作品的每个人都看到相同大小的纸张，用于访问网络的设备的多样性使像素完美设计的整个概念失效，仅在它所针对的一个设备上看起来不错。 Web 设计的重点是让目标受众可以访问网站，目标受众通常应该尽可能大，并且会使用各种设备和设置。

操作系统已经开始使用矢量 UI 元素，或者至少使用平滑缩放的大型源位图。您也应该忘记称为“像素”的任意度量单位，并使您的设计与最广泛的访问设备阵列兼容。

附录 - 附加points raised by Diogenes

不幸的是，在当前流行的操作系统中，具有 DPI 意识（因此适当支持 pt 大小的文本）的实际情况是，由于缺乏更强大的可打印单词，集群失败，正如 @987654324 所总结的那样@：

不幸的是，大多数计算机不知道 [显示器的 DPI]，因此浏览器也不知道...在缺乏这些知识的情况下，操作系统和浏览器通常只是做出假设，而这些假设通常是错误的。

因此，虽然理论上点是固定文本的最佳单位，但实际上在今天使用它们会在许多操作系统/浏览器/屏幕配置中产生不一致的结果。因此，设计师经常不得不放弃并恢复到像素来实现固定的字体大小。就个人而言，我使用百分比和 em，完全避免使用固定大小。

CSS-Discuss 档案有一个很棒的summary of the font sizing issues，以及许多指向详细信息和各种方法的链接。

【讨论】：

但在我上面的示例中，将 8pt 更改为 10px 解决了问题，现在它在我测试的所有计算机上所有浏览器上看起来都是正确的，所以看起来确实是 px 保持字体大小不变无论屏幕的 DPI 设置如何
MaxVT 提出了一些非常好的观点。在理想的世界中，我们只需指定一个 pt 大小，并且知道其 DPI 和所有内容的设备将准确地为我们提供我们所期望的。还没有，所以上下文仍然很重要。
爱德华：我父亲的电脑有大字体。他的机器上的所有文本都应该比我的大。如果您或您的客户对“正确”的定义是在具有任何设置的机器上看起来完全相同，那么您的解决方案有效，但我的论点是它是“正确”的错误定义。
这里必须同意MaxVT； px 在大多数屏幕上显示相同，即使是用户希望它更大的屏幕，从而剥夺了可能有视觉障碍的用户。

【解决方案5】：

在 IE7 上有一个缩放级别和一个文本大小。最可能的情况是他们无意中更改了其中一项设置。让他们点击“页面”按钮并查看“缩放”和“文本大小”设置。

【讨论】：

在 IE 和 firefox 中的页面放大就像是一个图形一样扩展了整个站点，它似乎没有在 CSS/HTML 级别上运行

【解决方案6】：

正如其他 2 个答案所建议的那样，DPI 设置可能会给您带来麻烦。我发现，一旦您考虑 DPI 设置和不同的浏览器默认字体，将 pt、ex、em 与 px 大小混合可能是一个真正的挑战。

所以现在我只使用 px 作为字体大小。大多数问题都会消失。

附：不要强迫该单个用户返回常规 DPI。我敢打赌他们年纪大了，需要老花镜，而且他们得到的新的高分辨率显示器更难阅读，因为印刷品太小了。有人调整了 DPI，现在字体和旧显示器一样大，所以现在他们真的更喜欢新显示器了。现在的问题是一些网页搞砸了。这就是你进来的地方。

在将显示器从 CRT 更改为纯平屏幕时，您可能需要注意的另一件事是数字字体平滑设置。模糊字符变得更清晰。幸运的是，这不会影响您的网页。

附录 - MaxVT提出的地址点

MaxVT 在他的回答中提出了一些很好的观点。上下文当然很重要。

我的回答有点懒惰和不完整。我使用 px 的原因是因为跨浏览器的不一致。在我看来，指定磅值应该在用户正在使用的设备上为用户指定字符的物理大小，但实际上并没有。

例如，假设你 font-family: cursive;字体大小：11pt

在 Windows 下的大多数浏览器中，默认为备受诟病的 MS-Comic 字体。 IE7 决定使用其他一些默认值，在相同的磅值下，该字体似乎更小且可读性更低。 Arial 与 Verdana 字体也是如此。指定相同的磅值，您的整个布局就会发生变化。在设置中加入 DPI 设置，这很混乱。

每英寸点数 (DPI) 设置有点不合时宜。您的显示器或手机具有固定的 DPI。如果您有新的显示器或电话，您只能更改它。有一个对话框来更改 DPI 只是因为设备不会向操作系统报告 DPI 是什么。这是一个不完美的世界。

所以我给你这个建议 - 现在使用 px 来指定字体大小，但只使用一次。使所有其他尺寸相对于您的基本字体。

然后，当您必须将所有内容移植到性能更好的最新黑莓或 iPod 上时，从 11px 切换到 11pt 会很容易。并测试您的软件，使其在您增大字体大小时看起来确实不错。

【讨论】：

我一直读到应该使用 px 而不是 pt 这样做，不知道为什么，有趣
您的附录让我对我的答案进行了一些更改，以解决当前支持 pt 大小文本的限制。谢谢！