Question

我想用css编码在网上显示Gotham-Light，但我无法编码。我有两个名为Gotham-Light.eot，Gotham-Light.ttf的字体。现在我如何在浏览器上使用？请帮帮我。

Answer 1

像这样定义你的字体：

@font-face{
   font-family: gotham-light;
   src: url('gotham-light.ttf') url('gotham-light.eot');
}

并像平常一样使用它

#someelement {
    font-family: gotham-light;
}

Answer 2

@font-face {
    font-family: 'GothamLight';
    src: url('/fonts/Gotham-Light.eot');
    src: url('/fonts/Gotham-Light.otf') format('opentype'),
         url('/fonts/Gotham-Light.eot?iefix') format('embedded-opentype'),
         url('/fonts/Gotham-Light.woff') format('woff'),
         url('/fonts/Gotham-Light.ttf') format('truetype'),
         url('/fonts/Gotham-Light.svg#gothamlight') format('svg');}

Answer 3

这不适用于IE，但FF和Chrome可以做到这一点

@font-face{
font-family: gotham-light;
src: url('gotham-light.ttf');
}

或

@font-face{
font-family: gotham-light;
src: url('gotham-light.eot');
}

然后将font-family应用于css中所需的任何类

如何在Gotham-Light字体中使用@ font-face？

3 个答案: