CSS @font-face src: local - 如果用户已经拥有本地字体,如何使用它?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3837249/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
@font-face src: local - How to use the local font if the user already has it?
提问by dbarbosa
What is the right way to use @font-face
so that the browser will not download the font if the user already have it?
@font-face
如果用户已经拥有字体,那么浏览器不会下载字体的正确使用方法是什么?
I am using @font-face to define DejaVu, which is already installed on my system (linux). Firefox is not downloading the font, but Chromium is downloading it every time!
我正在使用@font-face 来定义 DejaVu,它已经安装在我的系统 (linux) 上。Firefox 没有下载字体,但 Chromium 每次都在下载!
My CSS code, based on font squirreland that questionlook like this:
@font-face {
font-family: 'DejaVu Serif';
src: url('DejaVuSerif-webfont.eot');
src: local('DejaVu Serif'), url('DejaVuSerif-webfont.woff') format('woff'), url('DejaVuSerif-webfont.ttf') format('truetype'), url('DejaVuSerif-webfont.svg#webfontCFu7RF0I') format('svg');
font-weight: normal;
font-style: normal;
}
/* ... @font-face definitions for italic and bold omitted ... */
@font-face {
font-family: 'DejaVu Serif';
src: url('DejaVuSerif-BoldItalic-webfont.eot');
src: local('DejaVu Serif Bold Italic'), url('DejaVuSerif-BoldItalic-webfont.woff') format('woff'), url('DejaVuSerif-BoldItalic-webfont.ttf') format('truetype'), url('DejaVuSerif-BoldItalic-webfont.svg#webfontQAewh7pf') format('svg');
font-weight: bold;
font-style: italic;
}
回答by Thariama
If you want to check for local files first do:
如果要先检查本地文件,请执行以下操作:
@font-face {
font-family: 'Green Sans Web';
src:
local('Green Web'),
local('GreenWeb-Regular'),
url('GreenWeb.ttf');
}
There is a more elaborate description of what to do here.
还有一个更详尽的描述的在这里做什么。
回答by Paul D. Waite
I haven't actually done anything with font-face
, so take this with a pinch of salt, but I don't think there's any way for the browser to definitively tell if a given web font installed on a user's machine or not.
我实际上没有对 做任何事情font-face
,所以请稍加保留,但我认为浏览器没有任何方法可以明确判断用户机器上是否安装了给定的网络字体。
The user could, for example, have a different font with the same name installed on their machine. The only way to definitively tell would be to compare the font files to see if they're identical. And the browser couldn't do that without downloading your web font first.
例如,用户可以在他们的机器上安装具有相同名称的不同字体。明确判断的唯一方法是比较字体文件以查看它们是否相同。如果不先下载您的网络字体,浏览器就无法做到这一点。
Does Firefox download the font when you actually use it in a font
declaration? (e.g. h1 { font: 'DejaVu Serif';
)?
当您在font
声明中实际使用它时,Firefox 是否会下载该字体?(例如h1 { font: 'DejaVu Serif';
)?