WEB网页之@font-face与机能
发布时间：2018-09-01 09:49:23 所属栏目：运营 来源：站长网
导读：上一周我在Ajaxian中看到了一篇关于 @font-face 的文章。对付字体文件怎样影响web网页服从的题目我已经思索了几个月了，于是我继承读了几篇文章，终于形成了下面这些本身的观点。 FOUT：Flash of Unstyled Text Paul 将Flash of Unstyled Text指为FOUT。这
|
假如你如故要行使@font-face，我提议在页面所有加载完毕后再下载字体文件，如 后加载测试 中一样。 这将办理IE中的题目——整张页面渲染之后，字体才会再靠山下载，并在下载完成后加强我们的样式结果。这个能力在其他赏识器中也同样有甜头。行使后加载，大部门的赏识器将都不会呈现赏识器忙的标识。后加载的代码大抵如下： Copy to Clipboard 引用的内容：[www.veryhuo.com]
function lazyload() { var sRule1 = "@font-face {" + " font-family: 'Yanone';" + " src: url('/bin/resource.cgi?type=font&sleep=6');" + " src: local('Yanone'), " + "url('/bin/resource.cgi?type=font&sleep=6') " + "format('truetype');" + "}"; var style1 = document.styleSheets[0]; if ( "function" === typeof(style1.insertRule) ) { // Firefox, Safari, Chrome style1.insertRule(sRule1, 0); } else if ( "string" === typeof(style1.cssText) ) { // IE style1.cssText = sRule1; } } 留意这只是个原型，并不是一个美满的办理步伐。 在Paul的文章中提到了预读取字体文件，不外必要留意的是这个技能并不得当IE。我以为IE将是最难办理的题目，我同时但愿可以或许将样式表、剧本文件和图片的优先级进步。这取决于页面以及字体文件的行使。 我不提议在样式表中行使 data:URIs 来界说字体文件。因为样式表也许包括了EOT和TTF两种名目标数据，这也许会让下载的数据更加。这同样也会另样式表的加载时刻增添，而在大部门赏识器中样式表会阻断页面加载。
总结 只在你确定你很是必要 @font-face的时辰才行使他 （编辑：湖南网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
站长推荐
热点阅读