Question

我无法弄清楚为什么Arial Narrow正在为mac上的某些Firefox用户正确显示，而不是其他人。这是链接：http://teknikor.bethmotta.com/（参见导航字体）

我的代码是：

font-family: "Arial Narrow", Arial  sans-serif; font-weight:500; 
font-stretch:condensed;

我甚至尝试添加字体重置：

font-family: inherit; font-stretch:inherit; font-style:inherit;
font-family: "Arial Narrow", Arial  sans-serif; font-weight:500; 
font-stretch:condensed;

我试图专门针对Firefox：

@media screen and (-webkit-min-device-pixel-ratio:0){
ul.navcontainer li {
font-family: inherit; font-stretch:inherit; font-style:inherit; 
font-family:"Arial Narrow", Arial, Helvetica, sans-serif; font-stretch:condensed;}  
}

我不确定为什么它适用于某些Firefox mac用户而不适用于其他用户。所有经过测试的计算机都在运行Firefox 19.在Arial Narrow不工作的计算机中，字体默认为Times而不是Arial。

我注意到在正确显示的计算机上，Arial Narrow安装在用户库和系统库中。在我看到Times的计算机上，Arial Narrow只在系统库中，而不是用户库...但是，Arial安装在两者中，为什么导航默认为Times？

一般情况下，Firefox是否会在mac用户库或系统库中定位字体？

有关如何解决此问题的任何其他建议？我错过了一些简单的东西吗？

非常感谢任何帮助。

Answer 1

好吧，好吧，如果有人有兴趣，我想出了什么。我在样式表中添加了小写的“arial”，Firefox默认为arial而不是Times。

Answer 2

您可以尝试以下CSS3规则：

@font-face { font-family: Arial Narrow;
src: url('ArialN.ttf'),
     url('ArialN.eot'); /* IE9+ */

要使其正常工作，您需要将字体文件（！）包含在相应的文件夹中。

使用示例：

<!DOCTYPE html>
<html>
<head>
<style> 
@font-face { font-family: Arial Narrow;
    src: url('ArialN.ttf'),
         url('ArialN.eot'); /* IE9+ */
}
div{font-family:Arial Narrow;}
</style>
</head>
<body>

<div>
With CSS3, websites can finally use fonts other than the pre-selected "web-safe" fonts.
</div>

<p><b>Note:</b> Internet Explorer 9+ only supports fonts of type .eot. Internet Explorer 8 and earlier, do not support the new @font-face rule.</p>

</body>
</html>

Mac上的Firefox 19和Arial Narrow

2 个答案: