html - CSS3中的@ font-face无法正常工作

我正在尝试为我的网站执行@ font-face，但是很遗憾，它无法正常工作。
我试过了：

@font-face {
    font-family: BN Shirly; /*Adding a custom font*/
    src: url('Fonts/BN Shirly.ttf');  /*Source of font*/
}

然后在跨度中，我想将文本用于：

#categories span {
    color: white;
    font-family: 'BN Shirly';
    font-size: 30px;
}

如何解决此问题，以便我的自定义字体可以使用？

最佳答案

@font-face {
   font-family: BN-Shirly; /*Adding a custom font*/
   src: url('Fonts/BN-Shirly.ttf');  /*Source of font*/
}


#categories span {
    color: white;
    font-family: BN-Shirly;
    font-size: 30px;
}

我只是在字体系列中看到一个空格，只需删除该空格并尝试一下即可。并删除声明类中的引号。

更新

@font-face {
    font-family: 'BN-Shirly';
    src:    url('Fonts/BN-Shirly.ttf') format('truetype');
}