为什么不在@ font-face,Font Squirrel中定义font-weight或font-style?

时间:2010-09-25 21:22:31

标签: css font-face

当我们定义@ font-face样式时,我们可以定义引用的文件是否用于字体的粗体,斜体或粗体斜体版本,如本SO问题所述:

How to add multiple font files for the same font?

示例:

@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声明来区分粗体和斜体变体?为什么要使用单独的字体系列?他们是否在某些浏览器中了解(缺乏)对此功能的支持?

4 个答案:

答案 0 :(得分:17)

默认情况下,Font-Squirrel执行此操作是为了增加对不符合规范的用户代理(忽略font-weightfont-style的用户代理)的支持。 / p>

如果您不关心那些过时的用户代理,您可以启用“样式链接”选项,该选项可在@font-face工具包生成器的专家部分中找到。请注意,IE8及以下版本会忽略编号为font-weight的值,仅支持normalbold(以及相应的400700权重值。

答案 1 :(得分:9)

它确实涉及在字体内部戳戳以确定字体何时是粗体或斜体。并且必须在字体内设置某些位,以便IE获取样式链接。大多数粗体/斜体字体都设置了这些位,但不是全部。我们正在努力使这更加自动化。

答案 2 :(得分: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。跨浏览器功能显然将成为最终解决方案的一部分。

答案 3 :(得分:0)

使用默认FontSquirrel方法的问题是,如果加载后备字体,所有权重都将丢失,因为它们都已设置为正常。我认为风格链接是最好的方法。

如果您担心IE8用户,可以使用条件css。