相关疑难解决方法(0)

什么是正确的使用方式,@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;
}

我需要在html文件中包含一个字体(OpenSymbol),字体文件在本地文件夹中(我知道它的确切绝对路径).如果我像这样使用@ font-face:

@font-face {
  font-family: "OpenSymbol";
  src: url("<absolutePath>/OpenSymbol.ttf") format("truetype");
}

它适用于Chrome,Opera和Safari,但不适用于Firefox和IE9.其他@ font-face用法在所有浏览器中都可以正常使用.

顺便说一句,在Chrome中,我收到警告:

Resource interpreted as Font but transferred with MIME type application/octet-stream

我该怎么做才能干净地包含一个未安装在操作系统上的本地存储字体？

编辑:

我发现不同网址的列表似乎不起作用!如果我把[...].ttf网址放在首位,Chrome会加载字体,但如果它放在其他地方则不会!

第二编辑:

我让它在除Firefox之外的所有浏览器中工作:

@font-face { 
  font-family: 'OpenSymbol';
  src: url('file:<path>/openSymbol.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face { 
  font-family: 'OpenSymbolEOT';
  src: url('file:<path>/openSymbol.eot') format('embedded-opentype');
  font-weight: normal;
  font-style: normal;
}
...

然后

.element {
  font-family: OpenType, OpenTypeEOT, [...];
}

无论如何,它确实在IE中工作,但不在eclipse中,它使用IE的渲染引擎... oO

顺便说一句,firefox因安全问题而出现问题:请看这里