css – 如何使用font-weight与font-face字体?

前端之家收集整理的这篇文章主要介绍了css – 如何使用font-weight与font-face字体?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有两个字体文件,如:FONT-light和FONT-bold。两个都来自@ font-face kit,所以每个版本都有5个字体文件(OGV,TTF,WOFF,EOT)。

要从浅色版到粗体版我必须使用font-family:FONT-light;然后font-family:FONT-bold ;.我想使用font-weight:light;和font-weight:bold;而是因为我需要它到CSS3转换。我该如何实现?

解决方法

@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/

猜你在找的CSS相关文章