css - 字体在 chrome 扩展中不起作用

Question

我 99.9% 确定我有这个权利，但由于某种原因它不起作用。

我正在制作一个将 CSS 注入(inject)页面的 chrome 扩展，在我想更改字体之前，我的 CSS 一直运行良好。

所以我的 list 有这个...

"css": ["css/my-custom.css"],
"js": [ "js/jquery.js", "js/my-custom.js", "js/jquery.cookie.js"],
"web_accessible_resources": ["css/my-custom.css", "fonts/Roboto-Regular.ttf", "images/*.*"]

...我的 CSS 有这个...

@font-face {
    font-family: 'RobotoLtRegular';
    src: url('chrome-extension://__MSG_@@extension_id__/fonts/Roboto-Regular.ttf');
    font-weight: normal;
    font-style: normal;
}

body {
    background: #f1f1f1 !important;
    font-size: 1.2em !important;
    font-family: RobotoLtRegular !important;
}

p {
    font-family: RobotoLtRegular !important;
}

...然而，当我重新加载我的扩展程序时，我没有看到新字体。 chrome 元素检查器还显示该字体应该是 body 和 p 上显示的字体(没有其他字体覆盖 RobotoLtRegular。

仅供引用，我的字体存储在扩展程序的 css 目录中，因此路径是正确的。

我完全不知所措。

任何建议都会有所帮助。

更新:如果有帮助，我将其作为解压扩展加载。

Answer 1

解决方案是将 web_accessible_resources 添加到 list 中(适用于 list 版本 2):

"web_accessible_resources": ["*.ttf" ]

要包含任何其他文件类型，您可以将它们分开:

"web_accessible_resources": [ "*.png", "*.ttf" ]

完美运行。