firefox(ff)下无法显示bootstrap图标问题的解决方案_html/css_WEB-ITnose
程序员文章站
2024-02-09 20:54:58
...
最近在一个基于bootstrap的项目中遇到了一个问题,问题的表现是无法显示bootstrap自带的那套名为“glyphicon”的图标,在图标的引用处显示的是一个小方块儿,里面隐约可见4个貌似为16进制的字符,如图所示:。好端端、现成儿的图标用不了,悲哀~
但在chrome和IE 10下面则是可以正常显示的,说明这个问题并不是因为使用不当、相关文件存储位置错误而导致。而且,在另一个基于同样版本bootstrap的项目中则没有遇到这个问题,怪哉~~
后在网上搜到了解决方案,在此分享以供各位遇到问题的同好参考:在ff的地址栏中输入“about:config”,即进入配置界面。进入后,搜索“security.fileuri.strict_origin_policy”,这是该值应该是true。双击该项,其值自动变为false,即可。修改后,再刷新遇到问题的页面,即可看到正常显示的图标了。
那是什么原因导致了这个问题的出现呢?原因是ff的一个安全策略导致的。该策略限制了HTML文件访问不在根目录下的文件夹中的web fonts。这种限制只在本地开发环境下,同时web fonts并未从远程获取时出现。
后来看了下前面提到的那个没有出现问题的bootstrap项目。果然,其fonts文件夹被放置在了项目的根目录下。这样即使不去改变上述安全策略,也是可以正常显示的。
推荐阅读
-
firefox(ff)下无法显示bootstrap图标问题的解决方案_html/css_WEB-ITnose
-
一个在firefox下异常的li显示问题,在IE78等版本都显示正常_html/css_WEB-ITnose
-
一个在firefox下异常的li显示问题,在IE78等版本都显示正常_html/css_WEB-ITnose
-
火狐打开本地bootstrap页面,小图标无法正常显示问题_html/css_WEB-ITnose
-
火狐打开本地bootstrap页面,小图标无法正常显示问题_html/css_WEB-ITnose
-
firefox(ff)下无法显示bootstrap图标问题的解决方案_html/css_WEB-ITnose