Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/80.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html 是否在浏览器扩展名中包含本地文件?_Html_Css_Google Chrome_Safari_Font Face - Fatal编程技术网

Html 是否在浏览器扩展名中包含本地文件?

Html 是否在浏览器扩展名中包含本地文件?,html,css,google-chrome,safari,font-face,Html,Css,Google Chrome,Safari,Font Face,我目前正在为Chrome和Safari开发一个浏览器扩展。更具体地说,当用户将鼠标悬停在某些关键字上时,将显示工具提示。目前,我正在使用@font-face,其中包含指向我网站上托管的某些字体的链接。问题是,它们需要很长时间才能加载。是否可以在浏览器扩展中本地包含字体,而不是在外部链接到字体?你能把字体(甚至图像?)和其他扩展文件打包吗?是的,你能,这是很常见的。只需确保您有权分发所有未编写的字体/图像。拥有个人驾照并不重要 每个扩展都保存在本地,无论使其正常工作的代码是否需要internet访

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

是的,你能,这是很常见的。只需确保您有权分发所有未编写的字体/图像。拥有个人驾照并不重要

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

一般来说,字体是很小的文件(很少超过200k,除非它们是grunge类型,或者你嵌入的字符太多了),因此如果它们是自托管的,并且加载时间太长,那么你的主机可能会出问题。如果我是你,我会使用谷歌字体,这些字体不需要自托管,而且是免费的

有 无论您选择哪个选项,都可以嵌入它们。但下面是一个如何链接到本地存储在
.crx
文件中的字体的示例,
标记位于
标记之间:

<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>

@字体{
字体系列:“开放式SAN”;
字体风格:普通;
字体大小:400;
src:local('OpenSans')、local('OpenSans')、url(“字体/OpenSans常规webfont.woff”)格式(“woff”);
}
@字体{
字体系列:“开放式SAN”;
字体:斜体;
字体大小:400;
src:local('OpenSans-Italic')、local('OpenSans-Italic')、url(“font/OpenSans-Italic-webfont.woff”)格式(“woff”);
}
显然,所有路径都与
crx
目录中的
html
文件相关