移动端使用字体图标时文件排序需要注意

2016年09月29日作者:井井客整理来源:互联网

网上看到的,移动端字体图标加载顺序不同时效果也不同,可能会导致图标显示不正确等问题,特地写下来以备后用~

移动端使用字体图标时文件排序需要注意

推荐阅读地址-->http://www.cnblogs.com/Megasu/p/4305116.html

这里就直贴结论了:“移动端字体图标加载顺序应该为 eto,svg,woff,ttf(把SVG放到前面) ”

代码如下:

//移动端字体图标
@font-face {font-family: "iconfont";
  src: url('../font/iconfont.eot'); /* IE9*/
  src: url('../font/iconfont.svg#iconfont') format('svg'), /* iOS 4.1- */
  url('../font/iconfont.woff') format('woff'), /* chrome、firefox */
  url('../font/iconfont.ttf') format('truetype'); /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/ 
}

感觉作者写得很用心,有时间可以去原来的地址阅读一下,这里就不赘述了~

文章TAG:CSS

本文标题:移动端使用字体图标时文件排序需要注意
本文链接:http://www.jingjingke.com/c/29176.html

上一篇:[必备收藏]Font2Web在线转换字体成eot,otf,svg,wotf
下一篇:JS转换金额之数字到中文的转化