2

我遇到了下一个问题：我创建了 spring 项目，向其中添加了脚本、样式和字体，映射了资源，但没有连接字体。这是萤火虫控制台：

"NetworkError: 404 Not Found - http://localhost:8080/myApp/resources/fonts/cabin-regular.woff"
"NetworkError: 404 Not Found - http://localhost:8080/myApp/resources/fonts/cabin-regular.ttf"

图像等已正确加载，所以我不去哪里寻找问题。这是我的 css 文件的一部分，我在其中连接字体：

@import url(reset.css);

a{
    text-decoration: none;
    font-family: Cabin-Regular, sans-serif;
    color: #472c7f;
}
a:hover{

}


@font-face {
    font-family: 'Cabin-Regular';
    src: url('../fonts/cabin-regular.eot');
    src: url('../fonts/cabin-regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/cabin-regular.woff') format('woff'),
         url('../fonts/cabin-regular.ttf') format('truetype'),
         url('../fonts/cabin-regular.svg#cabin-regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

如果需要，我也可以提供上下文。我会对任何建议或答案感到满意。谢谢！

升级版：

文件结构是这样的：

/resources

             /fonts

             /styles

             /images

等等

4

1 回答 1

0

首先，检查您的 FTP 以查看它是否更改了文件类型或完全删除了扩展名。某些 FTP 应用程序和服务器的行为方式与 Windows 相同，并隐藏了使您的路径不正确的扩展程序。

除此之外，尝试通过Fontsquirrel上的字体生成器传递你的字体，并记住选择 base64。简而言之，Base64 会将整个字体嵌入到您的 CSS 中，并允许大多数浏览器在不链接到实际字体文件的情况下重新创建它。缺点是由于 base64 编码字体添加的数据量，您的 css 会增加相当多的大小。请记住在 fontsquirrel 上选择您需要的所有格式，而不仅仅是 base64。

于 2012-08-23T09:18:34.330 回答