Question

我需要你帮助解决一个非常奇怪的问题。我们需要使“Arial”在所有浏览器中都100％相似。为此，我们使用@ font-face并为Arial使用了不同的文件名。它适用于所有浏览器（逐像素），但在某些机器中它表现不同......所有系统都具有相同的配置和浏览器版本。到目前为止，问题似乎与Mozilla有关。我尝试了一切，但没有结果。我使用'font squirrel'来转换字体（基本/最佳/专家）。这是我的CSS。

@font-face {
font-family: 'conduit_arial';
src: url('../Helper/Fonts/conduit_arial.eot');
src: url('../Helper/Fonts/conduit_arial.eot?#iefix') format('embedded-opentype'),
     url('../Helper/Fonts/conduit_arial.woff2') format('woff2'),
     url('../Helper/Fonts/conduit_arial.woff') format('woff'),
     url('../Helper/Fonts/conduit_arial.ttf') format('truetype'),
     url('../Helper/Fonts/conduit_arial.svg#conduit_arial') format('svg'); 
font-weight: normal;
font-style: normal;
}

我们在字体和不同的文件名中使用了不同的名称，因此浏览器不会从系统字体加载Arial。朋友们请帮助我找出问题所在。感谢

Answer 1

我担心这不可能达到100％。让我解释一下原因：

Arial可能是最广泛传播的字体。让我们说这并不能让我们感到安全。
正如您所做的那样，您可以确保使用font-face和字体的不同名称加载相同的字体。你现在可以肯定吗？不完整，因为有些浏览器可能不支持font-face ......
我们假设您不需要支持早于ie9的浏览器。现在你必须确定......再也没有了！不同的浏览器和不同的操作系统有不同的处理字体的方法。 Windows具有用于呈现的ClearType引擎，与OS X的引擎不同（此处有更多信息：http://www.smashingmagazine.com/2012/04/24/a-closer-look-at-font-rendering/）
我们假设你只需要支持Windows 7和8.现在你必须确定......再没有！不同的浏览器可能以不同的方式呈现字体。例如，旧版本的Chrome在Windows上没有很好的抗锯齿功能。他们的字体更清晰但更丑陋！

我的建议：正如您所看到的，您可以控制许多事情......但是，您可以遵循一些良好做法以减少问题。尝试为字体提供精确的像素尺寸，即使在使用em时也是如此，特别是对于较小的字体尺寸。例如，使用0.875em而不是0.9em，避免设计用于打印的字体，特别是内容（如常用的Helvetica），并明智地使用字体后备。

与Mozilla的arial字体面临问题

1 个答案: