这是一个普遍的问题,似乎有一个解决方案.
问题是网页字体在chrome中显示不连贯.解决方案应该是在.woff调用之前移动.svg调用.这里解释： http://www.fontspring.com/blog/smoother-web-font-rendering-chrome和这里： http://www.adtrak.co.uk/blog/font-face-chrome-rendering/
问题是网页字体在chrome中显示不连贯.解决方案应该是在.woff调用之前移动.svg调用.这里解释： http://www.fontspring.com/blog/smoother-web-font-rendering-chrome和这里： http://www.adtrak.co.uk/blog/font-face-chrome-rendering/
问题是,我正在使用谷歌网络字体,并导入这样的字体：
<link href='http://fonts.googleapis.com/css?family=Asap:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
我不知道,也不知道如何使用@ font-face css标签而不是上面的标签导入它.我试过了,但是因为谷歌只提供ttf中的字体而不是svg或woff而卡住了.
希望你能帮忙.
解决方法
如果要应用此修复,则必须自己托管字体.
您的Google字体链接是对样式表的请求,该样式表可根据您提供的参数和浏览器检测动态构建.对于您的示例链接：
<link href='http://fonts.googleapis.com/css?family=Asap:400,700italic' rel='stylesheet' type='text/css'>
如果您实际使用curl自己提出请求：
$curl http://fonts.googleapis.com/css?family=Asap:400,700italic
这是被送回的内容：
@font-face {
font-family: 'Asap';
font-style: normal;
font-weight: 400;
src: local('Asap'),local('Asap-Regular'),url(http://themes.googleusercontent.com/static/fonts/asap/v1/-KZsao_xwBpcExaHoPH8_w.ttf) format('truetype');
}
@font-face {
font-family: 'Asap';
font-style: normal;
font-weight: 700;
src: local('Asap Bold'),local('Asap-Bold'),url(http://themes.googleusercontent.com/static/fonts/asap/v1/5DVGWnz9Skaq1amwwwGZEw.ttf) format('truetype');
}
@font-face {
font-family: 'Asap';
font-style: italic;
font-weight: 400;
src: local('Asap Italic'),local('Asap-Italic'),url(http://themes.googleusercontent.com/static/fonts/asap/v1/8YIp-EIJXA6NJdTPxy9qiQ.ttf) format('truetype');
}
@font-face {
font-family: 'Asap';
font-style: italic;
font-weight: 700;
src: local('Asap Bold Italic'),local('Asap-BoldItalic'),url(http://themes.googleusercontent.com/static/fonts/asap/v1/_sVKdO-TLWvaH-ptGimJBaCWcynf_cDxXwCLxiixG1c.ttf) format('truetype');
}
最简单的方法是返回Google Web Fonts,通过转到here并单击下载箭头下载相关字体.
然后你可以使用suggested fix from here,引用你下载的字体文件：
@font-face {
font-family: ‘MyWebFont’;
src: url(‘webfont.eot’);
src: url(‘webfont.eot?#iefix’) format(‘embedded-opentype’),url(‘webfont.svg#svgFontName’) format(‘svg’),url(‘webfont.woff’) format(‘woff’),url(‘webfont.ttf’) format(‘truetype’);
}
