有没有比这更好的方法来处理 font_face (谷歌字体)?
在尝试让 google 字体 (font_face) 与 IE7、8、9、Chrome 和 Firefox 一起使用时,我最终得到了本地存储在远程服务器上的一些复杂的文件,如 ttf、eot 和 woff。有没有更好/更简单的方法让它们适用于所有这些浏览器?这就是我最终为了让它发挥作用而所做的事情。
这是 html
<link href="Untitled_1.css" rel="stylesheet" type="text/css" />
<!--[if gte IE 7]>
<link rel="stylesheet" type="text/css" href="Untitled_1_ie.css" />
<![endif]-->
这是第一个 css (untitled_1.css):
@font-face {
font-family: 'Bangers';
font-style: normal;
font-weight: normal;
src: local('Bangers'), local('Bangers-Regular'), url('http://themes.googleusercontent.com/static/fonts/bangers/v4/DqeGA7eaz0hhOYTfkeJBIA.woff') format('woff');
src: url('Bangers.ttf'); /* for chrome/webkit */
}
这是第二个 (untitled_1_ie.css):
@font-face {
font-family: 'Bangers';
font-style: normal;
font-weight: normal;
src: url('Bangers.eot'); /* ie9 */
src: url('Bangers.eot?#iefix') format('embedded-opentype'); /* IE6-IE8 */
}
由于“无跨域”,IE9 只能使用本地存储的 eot(或 ttf)版本自定义字体错误,IE7/8 只能与 eot 配合使用,而 Chrome 则无法与 woff 配合使用(谷歌字体网站默认生成的字体)。
谢谢。
In trying to get google fonts (font_face) working with IE7, 8, 9, Chrome and Firefox I ended up with a bit of a convoluted mess of files stored locally, on a remote server, as ttf, eot and woff. Is there a better/easier way to get them working for all these browsers? This is what I ended up doing to get it to work.
This is the html
<link href="Untitled_1.css" rel="stylesheet" type="text/css" />
<!--[if gte IE 7]>
<link rel="stylesheet" type="text/css" href="Untitled_1_ie.css" />
<![endif]-->
This is the first css (untitled_1.css):
@font-face {
font-family: 'Bangers';
font-style: normal;
font-weight: normal;
src: local('Bangers'), local('Bangers-Regular'), url('http://themes.googleusercontent.com/static/fonts/bangers/v4/DqeGA7eaz0hhOYTfkeJBIA.woff') format('woff');
src: url('Bangers.ttf'); /* for chrome/webkit */
}
This is the second (untitled_1_ie.css):
@font-face {
font-family: 'Bangers';
font-style: normal;
font-weight: normal;
src: url('Bangers.eot'); /* ie9 */
src: url('Bangers.eot?#iefix') format('embedded-opentype'); /* IE6-IE8 */
}
IE9 would only work with a locally stored version of the eot (or ttf) due to 'no cross-domain custom fonts' error, IE7/8 would only work with eot and Chrome would not work with woff (the default produced by google fonts website).
Thanks.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论