@font-face {
font-family: 'ElegantIcons';
src:url('../src_main/fonts/ElegantIcons.eot');
src:url('../src_main/fonts/ElegantIcons.ttf') format('truetype'),url('../src_main/fonts/ElegantIcons.svg#ElegantIcons') format('svg'),url('../src_main/fonts/ElegantIcons.woff') format('woff'),url('../src_main/fonts/ElegantIcons.eot?#iefix') format('embedded-opentype');
font-weight: normal;
font-style: normal;
}
当我访问网页时,字体不起作用,在控制台中我得到：
downloadable font: download Failed (font-family: "ElegantIcons" style:normal weight:normal stretch:normal src index:1): status=2147500037 source: file:///...snipped.../src_main/fonts/ElegantIcons.woff @ file:///...snipped.../src_poke/fonts-style.css
通过将URL复制/粘贴到浏览器地址栏来访问该文件,可以看出这是正确的URL,因为我可以下载该字体.
解决方法
I believe this is working as designed. AIUI,the issue here is that
for a page loaded from a file:// URI,only files in (or below) the
same directory of the filesystem are considered to be “same origin”,
and so putting the font in a different subtree (../font/) means it
will be blocked by security policy restrictions.You can relax this by setting security.fileuri.strict_origin_policy to
false in about:config,but as this gives the page access to your
entire local filesystem,it’s something to be used with caution.
总而言之,“修复”而不重新安排文件：
打开关于：config
>将security.fileuri.strict_origin_policy设置为false
>谨防安全隐患
然而,最好的方法是确保任何资源都可以访问,而无需先备份文件系统.
注意：原始策略是基于html而不是css文件计算的！所以除了一个css文件之外的字体文件可能不起作用,这很令人困惑. (至少这是我以为Firefox的情况！)
跟进：
根除者评论：
It’s the other way around: relative paths are 07001.
chrylis回应：
You’d think that,but the actual code in Firefox doesn’t seem to agree.
