为什么不能在@font-face中定义字体的粗细或风格，Font Squirrel？

Question

为什么不能在@font-face中定义字体的粗细或风格，Font Squirrel？

15

当我们定义@font-face样式时，可以定义所引用的文件是字体的粗体、斜体或粗斜体版本，正如在这个SO问题中所讨论的那样：

示例：

@font-face {
    font-family: 'FontinSans';
    src: local('☺'), url('fontin_sans_regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'FontinSans';
    src: local('☺'), url('fontin_sans_bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

然而，Font Squirrel 不会以这种方式生成 @font-face 套件。相反，他们会采用以下方式：

@font-face {
    font-family: 'FontinSans';
    src: local('☺'), url('fontin_sans_regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'FontinSansBold';
    src: local('☺'), url('fontin_sans_bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

这意味着在我们的CSS文件中，我们必须像这样做：

h2 {
    font-family: 'FontinSansBold', Verdana, sans-serif;
    font-weight: normal;
}

为什么Font Squirrel不使用font-weight和font-style声明来区分粗体和斜体变体？为什么要使用单独的字体系列？他们是否知道某些浏览器对此功能的支持（或缺乏支持）有所了解？

- bjudson

被投票关闭并移交给网络管理员。 - user7116

4个回答

9

这确实涉及到在字体内部查找以确定字体是否为粗体或斜体。必须设置字体内的某些位，以便IE能够捕捉到样式链接。大多数粗体/斜体字体都已经设置了这些位，但并非所有字体都有。我们正在研究一种更自动化的方法。

- Font Squirrel

3

看起来Internet Explorer 8可能是那些不支持font-weight和font-style的“旧”用户代理之一。

我正在尝试使用@font-face和font-family使粗体/斜体/粗斜体自动化。

到目前为止，我的尝试没有任何成果。这里是一个演示问题的页面。

http://clearimageonline.com/apps/playground/fonts/test_IE.html

有人遇到过这种情况并且有解决方案可以在IE8上使用吗？

我已经搜索和研究了大部分这个星期，寻找这个问题的答案。看起来IE8不允许我这样做。

这里有一个提议的解决方法（非常丑陋的解决方法）......

http://clearimageonline.com/apps/playground/fonts/proposed_IE.html

这些测试页面仅适用于Internet Explorer浏览器。此测试仅限于IE浏览器。跨浏览器功能显然将成为最终解决方案的一部分。

- Terry Riegel

0

使用默认的FontSquirrel方法会存在一个问题，如果备用字体被加载，所有的字重都将丢失，因为它们都被设置为正常。我认为样式链接是最好的方法。

如果您担心IE8用户，可以使用条件CSS。

- laraborg

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Andrew Moore · Accepted Answer

默认情况下，Font-Squirrel这样做是为了提高对不遵循规范的用户代理（那些忽略font-weight和font-style的代理）的支持。

如果您不关心那些已过时的用户代理，可以在@font-face套件生成器的专家部分启用“样式链接”选项。请注意，IE8及以下版本会忽略带数字的font-weight值，只支持normal和bold（以及相应的400、700权值）。