当我们定义@ 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;
}
Run Code Online (Sandbox Code Playgroud)
但是,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;
}
Run Code Online (Sandbox Code Playgroud)
这意味着在我们的CSS文件中我们必须做这样的事情:
h2 {
font-family: 'FontinSansBold', Verdana, sans-serif;
font-weight: normal;
}
Run Code Online (Sandbox Code Playgroud)
为什么Font Squirrel不使用font-weight和font-style声明来区分粗体和斜体变体?为什么要使用单独的字体系列?他们是否在某些浏览器中了解(缺乏)对此功能的支持?
And*_*ore 17
默认情况下,Font-Squirrel执行此操作是为了增加对不遵循规范的用户代理(忽略font-weight和忽略的用户代理font-style)的支持.
如果您不关心那些过时的用户代理,您可以启用@font-face套件生成器专家部分中提供的"样式链接"选项.需要注意的是IE8和下面忽略编号font-weight值,并且仅支持normal和bold(和对应的400,700权重值).
它确实涉及在字体内部戳戳以确定字体何时是粗体或斜体.并且必须在字体内设置某些位,以便IE获取样式链接.大多数粗体/斜体字体都设置了这些位,但并非全部.我们正在努力使这更加自动化.