CSS3 自定义 Font Face 在 html 视图中无法正常工作
亲爱的朋友们, 我试图找出这里出了什么问题,为什么字体集在 FireFox 4 的 html 实时视图中无法正确显示......我一无所知!任何见解我将不胜感激。任何都可以!提前致谢。干杯!
<style type="text/css" rel="stylesheet">
@charset "utf-8";
@font-face{
font-family: "ZZZ";
src: local('FONT'),
url('http://www.site.org/FONT.ttf') format('truetype'),
url('http://www.site.org/FONT.eot') format('eot'),
url('http://www.site.org/FONT.otf') format ('otf'),
url('http://www.site.org/FONT.woff') format('woff')
}
html, body{font-family: "ZZZ" !important}
。
附言。我故意将名称更改为“ZZZ”
,而不是本地文件名“FONT”
,这样我就可以确保如果有人本地没有该字体,它将继续下载 CSS3 url。然而,这不起作用...(当将 ZZZ 更改为 Lithos Pro Regular 时,它可以工作,但这不是挑战...我希望它在不存在本地字体文件时自然工作。
Dear folks,
Im trying to figure out what is wrong in here, why the fonts set do not show up correctly in html live view in FireFox 4... I am clueless! Any insight will be greatly appreciated by me. Any at all! Thanks in advance. Cheers!
<style type="text/css" rel="stylesheet">
@charset "utf-8";
@font-face{
font-family: "ZZZ";
src: local('FONT'),
url('http://www.site.org/FONT.ttf') format('truetype'),
url('http://www.site.org/FONT.eot') format('eot'),
url('http://www.site.org/FONT.otf') format ('otf'),
url('http://www.site.org/FONT.woff') format('woff')
}
html, body{font-family: "ZZZ" !important}
.
PS. I changed the name to "ZZZ"
deliberately into something else than the local file name "FONT"
so that way I can assure that if someone does NOT have the font locally, it will proceed to download CSS3 url. This however does not work... (when changing ZZZ to Lithos Pro Regular, it works but that is no challenge... I want it to work naturally when no local font file is present.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
这里有一个很好的指南
http:// blog.themeforest.net/tutorials/how-to-achieve-cross-browser-font-face-support/
看起来这可能是版本支持问题 - 您使用的 Firefox 版本是什么?
There is an excellent guide here
http://blog.themeforest.net/tutorials/how-to-achieve-cross-browser-font-face-support/
Looks like this could be a version support issue - what version of firefox you using?
Internet Explorer 仅支持
.eot
类型字体,Firefox、Chrome、Safari 和 Opera 支持.ttf
和.otf
类型字体。Internet Explorer only supports
.eot
type fonts and Firefox, Chrome, Safari, and Opera support.ttf
and.otf
type fonts.尝试像这样放置本地字体:
Try placing the local font like this instead: