Question

我搜索了每个地方的原因，因为font-face在firefox中无法正常工作。我找到了几个不同的答案，但似乎没有解决问题。如果有人能给我一些很好的提示。

CSS代码：

@font-face
{
    font-family:Viking-Normal;
    src: url('../fonts/VIKING.eot') format("opentype"), url('../fonts/VIKING.ttf') format("truetype");
}

div#header
{
    font-family:Viking-Normal !important;
    font-size:58px;
    text-align:center;
    width:780px;
    height:150px;
    background:#0078A8;
    margin-left:auto;
    margin-right:auto;
}

Answer 1

了解您已尝试过的内容会有所帮助，但通过查看您的代码，我会想到三件事：

字体系列名称应介于单引号或双引号之间。

<强>如，
```
font-family: 'Viking-Normal';
```
您的字体路径可能有误，您是否可以直接从浏览器访问它，直到它完整的URL路径？

您的浏览器支持的字体文件可能已损坏或缺失。我使用font squirrel to generate所需的CSS和字体文件。

您只需要上传您的字体文件，它会弹出一个.zip，其中包含一个包含您的字体的演示，一个css就绪文件以及更好的跨浏览器支持所需的格式。

<强>如，

@font-face {
    font-family: 'VikingRegular';
    src: url('viking-webfont.eot');
    src: url('viking-webfont.eot?#iefix') format('embedded-opentype'),
         url('viking-webfont.woff') format('woff'),
         url('viking-webfont.ttf') format('truetype'),
         url('viking-webfont.svg#DearestRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@ font-face无法在firefox上运行

1 个答案: