CSS字体fallbackfont

前端之家收集整理的这篇文章主要介绍了CSS字体fallbackfont前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

当我使用fontface时,浏览器需要一些时间才能下载和渲染字体,直到那时显示浏览器默认字体.我试图将Arial作为fallbackfont和一般的HTML / BODY字体,但这不会改变问题.

有没有办法避免这种情况?

@font-face {
font-family: 'StrukturProBold';
src: url('fonts/strukturpro_bold_ubasic/StrukturPro-Bold-webfont.eot');
src: url('fonts/strukturpro_bold_ubasic/StrukturPro-Bold-webfont.eot?iefix') format('eot'),url('fonts/strukturpro_bold_ubasic/StrukturPro-Bold-webfont.woff') format('woff'),url('fonts/strukturpro_bold_ubasic/StrukturPro-Bold-webfont.ttf') format('truetype'),url('fonts/strukturpro_bold_ubasic/StrukturPro-Bold-webfont.svg#webfontpQgNQDw9') format('svg');
font-weight: normal;
font-style: normal;
}
body,html {
 font-family: "StrukturProBold",Arial,Helvetica,FreeSans,sans-serif,"open-serif",open-serif;
}
h1 {
 font-family: "StrukturProBold",open-serif;
}
最佳答案
除非访问者在其系统上安装了专业字体,否则浏览器必须像下载图像文件链接样式表或.js文件一样下载.

通过阅读上面的评论,您可能已经尽力而为.
StrukturProBold只是一个简单的无衬线字体.

你可以扩展你的二级字体选择列表,可能Arial和Helvetica不像Verdana或Trebuchet那样好.

font-family: "StrukturProBold",Trebuchet,Verdana,sans-serif;

猜你在找的CSS相关文章