Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/36.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
Performance @字体面unicode范围属性_Performance_Css_Font Face_Webfonts_Unicode Range - Fatal编程技术网

Performance @字体面unicode范围属性

Performance @字体面unicode范围属性,performance,css,font-face,webfonts,unicode-range,Performance,Css,Font Face,Webfonts,Unicode Range,在一些html文档中,我只对几个单词使用webfonts。在性能方面加载完整的字体文件似乎是浪费。这就是@font-face声明的unicode范围参数的作用: 使用它,我可以定义要加载的字体文件的字符,从而大大提高性能。 但我就是不能让它工作。奇怪的是,它在firefox中显示所有字符,如果我在声明中包含unicode范围参数,它就无法在safari中加载字体。 任何帮助都将不胜感激,以下是我测试它时使用的html: <!doctype html> <html lang="

在一些html文档中,我只对几个单词使用webfonts。在性能方面加载完整的字体文件似乎是浪费。这就是@font-face声明的unicode范围参数的作用:

使用它,我可以定义要加载的字体文件的字符,从而大大提高性能。 但我就是不能让它工作。奇怪的是,它在firefox中显示所有字符,如果我在声明中包含unicode范围参数,它就无法在safari中加载字体。 任何帮助都将不胜感激,以下是我测试它时使用的html:

<!doctype html>
<html lang="en">
<head>
<style text="text/css">
@font-face {
font-family: 'dream';
src: url(Fonts/Digital-dream/DIGITALDREAM.ttf) format("truetype");
unicode-range: U+FF21;
}

*{
font-family:dream;
font-weight:normal;
}
</style>
</head>
<body>
<p>ASDWEWQDSCF</p>
</body>
</html>

@字体{
字体家族:“梦想”;
src:url(字体/DIGITALDREAM/DIGITALDREAM.ttf)格式(“truetype”);
unicode范围:U+FF21;
}
*{
字体家族:梦想;
字体大小:正常;
}
ASDWEWQDSCF


您误解了该值的用途。从该页:

此描述符定义给定字体支持的Unicode字符范围

因此,这不是要下载的字形(或字符),这实际上是告诉浏览器字体中有哪些字符,以便浏览器可以首先确定是否值得下载字体。如果要设置样式的文本不在给定的
unicode范围内
,则不会下载字体


您参考的页面上的示例XIII显示了一个很好的示例。设想3个
@font-face
规则共享相同的
字体系列
属性。然而,第一条规则指向一个巨大的4.5MB TTF文件,其中包含所有可能需要的字形。第二条规则列出了一个小得多的1.2MB TTF,但表示只有在所有字符都符合日文字形范围时才使用它。第三条规则列出了一个非常小的190KB文件,如果要设置样式的文本仅为罗马文本,则可以下载该文件。

对。谢谢你!你知道我如何从unicode范围内实现我想要的吗?解决方案是创建多个版本的字体
DIGITALDREAM.ttf
。(你需要自己找到一个字体编辑器,但还有很多。)一个版本可能只包含大小写
a-Z
、数字和标点符号。这个文件可能非常小。第二个版本可能与第一个版本相同,但也包括重音字符。第三个版本可能只是巨大的原始TTF文件。关于如何设置,请按照链接上的示例XIII进行操作。还要记住,
unicode范围
是CSS3,所以浏览器支持可能还没有。谢谢Chris!我可能会调整字体文件的大小。Hm。问题是我使用的字体是经过许可的,所以我不能真正修改它。我要么动态修改它,要么以某种方式使用javascript来提取我正在寻找的内容。我想这有点复杂吧?最终你的许可证会规定你可以做什么。但是,如果您使用JavaScript做任何事情,您首先必须下载整个字体,因此我认为这不会有帮助。我会确保在服务器上打开GZip压缩,并为您的字体文件启用GZip压缩,并在客户端缓存这些文件。请尝试通过fontsquirrel.com生成跨浏览器@font-face工具包,然后应用unicode范围属性。我更喜欢理解字体声明,而不是使用生成…我对@fontface的理解在查看源代码工具包后增加了三倍。源代码是有史以来最好的文档。但你说一句讽刺的话就有道理了。您使用的是小写的HTML5 doctype,显然您不关心在使用元素之前理解它们