Chrome浏览器一些图标图片不显示及Font Awesome网络图标使用

登入https://ffmpeg.org网站下载ffmpeg,突然想起以前另一台电脑上的chrome浏览器里几个图标按钮不显示,只显示框框,这里显示了,遂好奇这几个图标文件在哪,

查看网页html:

发现标签i的class选择器里的fa,fa-5x,fa-fw都在font-awesome-min.css里有定义,唯独没有fa-linux,感觉图标文件就是fa-linux,查看官网,介绍fontawesome是字体图标库,有近700个矢量图标文件,下载到本地,fonts文件夹下是几种不同字体格式,fontawesome-webfont.svg可以用文件文本打开,可以看到linux图标矢量数据,17c(索引序号?),otf、eot、woff、woff2其他格式可以用在线字体编辑器打开(http://fontstore.baidu.com/static/editor/index.html)。

虽然本地文件里有数据,但现在网站一般都使用CDN,从cdn加载数据,而不是本地自带,如https://fontawesome.com/start介绍

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css" integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">

而网络上大部分CDN是google的,会被屏蔽,因此就无法正常加载图标文件了。chrome插件replace google cdn可以解决问题。

猜你喜欢

转载自blog.csdn.net/yaoyutian/article/details/90107629