gpt4 book ai didi

html - 在浏览器扩展中包含本地文件?

转载 作者:太空宇宙 更新时间:2023-11-04 13:19:35 25 4
gpt4 key购买 nike

我目前正在为 Chrome 和 Safari 开发浏览器扩展程序。更具体地说,当用户将鼠标悬停在某些关键字上时,会出现一个工具提示。目前,我正在使用@font-face 链接到我网站上托管的某些字体。问题是 - 它们需要很长时间才能加载。是否可以在浏览器扩展中本地包含字体而不是从外部链接到它们?您可以将字体(甚至图像)与其他扩展文件打包在一起吗?

最佳答案

是的,你可以,这很常见。只需确保您有权分发所有不是您创作的字体/图像。拥有个人许可证不算数。

每个扩展都保存在本地,无论使其运行的代码是否需要互联网访问和服务器端脚本。 Chrome 扩展只是一个保存为 crx 的目录存档,实际上是重命名的 zip文件。该目录以及必要的开发人员信息和元数据与任何其他站点的目录一样,带有 html。 , 和 css , javascript 、字体、图像等。显然,如果您的扩展确实使用服务器端脚本,则需要托管这些脚本。如果您正在构建扩展,我敢肯定您知道其中的大部分内容,但我正在详细说明以便初学者可以跟进。

一般来说,字体是很小的文件(很少超过 200k,除非它们是 grunge 类型,或者你嵌入的字符比必要的多得多),所以如果它们是自托管的并且加载时间太长,问题可能出在你的主人。如果我是你,我会使用不需要自行托管且免费的 Google 字体。

several ways 嵌入它们,无论您选择哪个选项。但这里有一个示例,说明如何链接到本地​​存储在 .crx 中的字体。文件,<style>标签位于 <head> 之间标签:

<style>

@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: local('Open Sans'), local('OpenSans'), url("fonts/OpenSans-Regular-webfont.woff") format("woff");
}
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 400;
src: local('Open Sans Italic'), local('OpenSans-Italic'), url("fonts/OpenSans-Italic-webfont.woff") format("woff");
}

</style>

显然,所有路径都是相对于 html 的文件在你的 crx目录。

关于html - 在浏览器扩展中包含本地文件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19944703/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com