在哪里放置font-face在CSS?

前端之家收集整理的这篇文章主要介绍了在哪里放置font-face在CSS?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
当您将@ font-face添加到您网站的单个css文件中时,最好的地方放在哪里?顶部的css文件底部

如果你把它放在顶端,我会认为这会减慢css的加载.如果你添加底部,那么所有的文本都会加载回退的字体,直到加载的字体也不是最佳的.所以当使用@ font-face而不是TypeKit,GoogleFonts等时,应该放在哪里?

*更新 – 要重申上述内容,请参考在哪里放置“@ font-face {font-family:’Ave Regular’; src:url(‘fonts / ave-regular.eot?#iefix’)… .etc“在css文件中,而不是放在身上”{font-family:fontname,arial,serif}等“.而且我明白它可以去任何地方工作,无论我放在顶部还是底部,还是在中间都不会产生“太多”的区别,但是寻找哪个更好,无论如何微乎其微根据某些使用情况更好.

解决方法

If you put it at the top I would think it would slow down the loading of the css.

不,不是的.在加载样式表的其余部分之前,浏览器不会等待下载字体.它将开始异步下载字体,但这些字体下载不会干扰除页面呈现之外的任何内容(请参阅FOUT).

如果你打算说顶级的规则会减慢速度,因为浏览器必须首先在其余的样式表之前下载规则,否则真的没关系,除非你有数十KB的@ font-face规则(非常非常非常不可能).

没有规则在哪里将@ font-face放在样式表中,但是为了组织目的,我通常会将最多的规则保留在顶部.

猜你在找的CSS相关文章