css - 如何将 font-weight 与 font-face 字体一起使用？

Question

我有两个字体文件，例如:FONT-light 和 FONT-bold。两者都来自@font-face 工具包，因此每个版本都包含大约 5 个字体文件(OGV、TTF、WOFF、EOT)。

要从浅色版本到粗体版本，我必须使用 font-family: FONT-light; 然后是 font-family: FONT-bold;。我想使用 font-weight: light; 和 font-weight: bold; 因为我需要它到 CSS3 过渡。我该如何实现？

Answer 1

@font-face {
    font-family: 'DroidSerif';
    src: url('DroidSerif-Regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'DroidSerif';
    src: url('DroidSerif-Italic-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'DroidSerif';
    src: url('DroidSerif-Bold-webfont.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'DroidSerif';
    src: url('DroidSerif-BoldItalic-webfont.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}

来自教程:http://www.456bereastreet.com/archive/201012/font-face_tip_define_font-weight_and_font-style_to_keep_your_css_simple/