2

我下载了一种免费字体，有两种字体，一种是普通字体，另一种是粗体。并使用以下格式：svg、eot、ttf、woff。这些字体在 IE 上运行良好。但它们在 Firefox 中不起作用。1. 我想知道哪种浏览器使用哪种格式。2.请帮我解决这个问题：

@font-face {
   font-family: "Nazanin";
   src: url("../font/nazanin.eot");  
   src: local("B Nazanin"),
     url("../font/nazanin.eot?#iefix") format('embedded-opentype'),
     url("../font/nazanin.woff") format("woff"),
     url("../font/nazanin.ttf") format("truetype"),
     url('../font/nazanin.svg') format('svg');
   font-weight: normal;
   font-style: normal;
}
@font-face {
   font-family: "Nazanin";
   src: url("../font/nazaninbold.eot");
   src: local("B Nazanin bold"),
     url("../font/nazaninbold.eot?#iefix") format('embedded-opentype'),
     url("../font/nazaninbold.woff") format("woff"),
     url("../font/nazaninbold.ttf") format("truetype"),
     url('../font/nazaninbold.svg') format('svg');
   font-weight: bold;
   font-style: normal;
}

顺便一提。我知道字体文件可以正常工作。

4

1 回答 1

1

所以你已经正确地声明了你的字体。您需要一个类才能在您的站点中使用它。所以你的css文件应该是这样的：

mycustomfont {
    font-family: 'Nazanin';
    font-style: normal;\* or bold whatever you need *\
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

然后在 HTML 中：

<div class="mycustomfont">Testing font</div>

希望这能给你一个想法......

于 2014-10-23T01:22:24.280 回答