css - @fontface css字体路径似乎不起作用

Question

我有一个名为 project 的目录，其中有目录 html、assets 和 javascript。 Assets 目录有目录fonts和css。css目录有一个名为typography的css文件.css。字体目录包含我正在使用的所有字体。

在html目录中我有一个文件typography.html。要使用字体，我在 typography.css 中使用此代码，该代码在我的 html 文件中正确链接/引用。但是 typography.css

中的此代码

@font-face {
    font-family: "LatoLight";
    src: url('../fonts/lato-light-webfont.eot') format("embedded-opentype"), url('../fonts/lato-light-webfont.woff') format("woff"), url('../fonts/lato-light-webfont.ttf') format("truetype"), url('../fonts/lato-light-webfont.svg') format("svg");
    }
    h1{ font-family: LatoLight !important; }

没有产生预期的结果。我正在使用 twitter bootstrap 3。为什么这不起作用？

Answer 1

尝试:

@font-face {
    font-family: 'LatoLight';
    src: url('../fonts/lato-light-webfont.eot') format("embedded-opentype"), 
         url('../fonts/lato-light-webfont.woff') format("woff"), 
         url('../fonts/lato-light-webfont.ttf') format("truetype"), 
         url('../fonts/lato-light-webfont.svg') format("svg");
    font-weight: normal;
    font-style: normal;
}

我已将双引号改为单引号。它可能会有所不同，但我不确定。

否则这可能会有所帮助 Bootstrap 3 unable to display glyphicon properly我知道它是字形，但 Firefox 可能只是遇到其他字体的问题。