5

Google 网络字体中的 Droid Serif 字体具有以下样式：

DroidSerif.ttf
DroidSerif-Bold.ttf
DroidSerif-BoldItalic.ttf
DroidSerif-Italic.ttf

我想使用@font-faceCSS 声明在“Droid Serif”下导入所有这些样式，font-family并使用该font-weight属性来指定我是否想要粗体和/或斜体，而不必在不同的情况下单独导入它们font-family：

@font-face {
    font-family: 'Droid Serif';
    src: url('../fonts/DroidSerif.ttf');
}

@font-face {
    font-family: 'Droid Serif Bold';
    src: url('../fonts/DroidSerif-Bold.ttf');
}

@font-face {
    font-family: 'Droid Serif BoldItalic';
    src: url('../fonts/DroidSerif-BoldItalic.ttf');
}

@font-face {
    font-family: 'Droid Serif Italic';
    src: url('../fonts/DroidSerif-Italic.ttf');
}

这可能吗？

PS 我已经尝试了每种谷歌网络字体的导入技术，但它们都不适用于 IE 9。

4

1 回答 1

2

本文有助于解释 @fontface 的防弹使用。仔细阅读，你会发现一些对 IE 有帮助的东西。

http://paulirish.com/2009/bulletproof-font-face-implementation-syntax/

我个人使用字体松鼠并参考各种文件类型以使所有浏览器都满意。我不确定你能做到你的要求，据我所知你不能。

这也有助于解释 @fontface 的字体权重 - 除非字体指定它具有一定的权重，否则您将无法更改它。http://css-tricks.com/watch-your-font-weight/

于 2012-08-15T12:24:26.457 回答