html - 在 CSS 文件中加载本地 woff2 文件不起作用
问题描述
我正在尝试在 CSS 文件中加载 woff2 字体文件。但是我不断收到错误消息,说找不到该文件。但路径是正确的。
我的 CSS 文件:
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: url("C:\Users\win10\Desktop\Electron_Projects\EnderFramework\_themes\_default\fonts\material_icons.woff2") format('woff2');
}
icon, icons{
font-family: 'Material Icons';
font-weight: normal;
font-style: normal;
display: inline-block;
line-height: 1;
text-transform: none;
letter-spacing: normal;
word-wrap: normal;
white-space: nowrap;
direction: ltr;
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
-moz-osx-font-smoothing: grayscale;
font-feature-settings: 'liga';
}
这是我不断收到的错误:
加载资源失败:net::ERR_FILE_NOT_FOUND file:///C:/Userswin10%C3%9Esktop%0Electron_Projects%0EnderFramework_themes_default%0Fontsmaterial_icons.woff2:1
解决方案
尝试指定一个不完整的文件路径,相对。
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: url("..\fonts\material_icons.woff2") format('woff2');
}
此外,由于使用反斜杠,可能会导致错误。
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: url("../fonts/material_icons.woff2") format('woff2');
}
推荐阅读
- android - 带有提示的 Android TextInputEditText 问题
- java - Java OffsetDateTime.parse() 为时间添加额外的零
- rust - Rust 声明先分配后分配模式
- javascript - 如何在 JavaScript 中遍历数组的元素?
- c++ - 具有数组属性的类的 C++ 复制构造函数
- python - 计算组合列的唯一值,并将它们放入数据框中
- python - Django QuerySet 使用子查询进行注释
- excel - 如何在没有唯一标识符的 Excel Power Pivot 数据模型中连接数据
- python - 覆盖待安装的源文件(不覆盖源目录下的原始文件)
- python - 如何分隔 Numpy 数组中的项目?