@ font-face src:local - 如果用户已有本地字体,如何使用本地字体?

dba*_*osa 64 css font-face

什么是正确的使用方式,@font-face以便浏览器不会下载字体,如果用户已经拥有它?

我正在使用@ font-face来定义DejaVu,它已经安装在我的系统(linux)上.Firefox没有下载字体,但Chromium每次都下载它!

我的CSS代码,基于字体松鼠,这个问题看起来像这样:

@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;
}
Run Code Online (Sandbox Code Playgroud)

Tha*_*ama 83

如果要先检查本地文件,请执行以下操作:

@font-face {
font-family: 'Green Sans Web';
src:
    local('Green Web'),
    local('GreenWeb-Regular'),
    url('GreenWeb.ttf');
}
Run Code Online (Sandbox Code Playgroud)

还有一个更详尽的描述的在这里做什么.

  • 您如何知道正确的字体名称是什么? (4认同)
  • 如果我们有2个src(如OP的例子)怎么办?我们把`local`放在第一个还是第二个? (3认同)
  • 啊好吧,@Awn,这是“全名”和“后记名称”。在 Mac OSX 上,可以在以下位置找到 https://apple.stackexchange.com/questions/79875/how-can-i-get-the-postscript-name-of-a-ttf-font-installed-in-os-x (2认同)