在学习bootstrap的时候,有一个问题始终非常疑惑和困扰,就是firefox无法显示bootstrap自带的那套名为“glyphicon”的图标,在图标的引用处显示的是一个小方块,如图所示(4前面的小方块):

  但在chrome和IE 10下面则是可以正常显示的,说明这个问题并不是因为使用不当、相关文件存储位置错误而导致。在firfox里面显示不出来的情况遇到两种:

1、我用的开发软件是webstorm,上图的页面,我从webstorm的浏览器图标里面打开,能显示出来符号,但是从文件夹直接双击html文件访问,浏览器上的符号就显示异常;

2、就是不管哪种方式打开,都显示不出来符号;

在网上搜索了很多原因如下:

1、有帖子说,可能是因为强制设置了字体,导致了ff浏览器无法正常显示bootstrap图标,按照帖子上面对字体进行了改动,还是无法解决问题,看来原因不是这个。

2、有帖子说可能是因为firfox的设置问题,解决办法步骤:

步骤一:在ff的地址栏中 输入“about:config”,即进入配置界面。

步骤二:进入后,看到这个页面:

步骤三:搜索“security.fileuri.strict_origin_policy”,这 是该值应该是true。

步骤四:双击该项,其值自动变为false,即可。

步骤五:修改后,再刷新遇到问题的页面,即可看到正常显示的图标了。按照这个办法试了试,果然可以看到图标了。

那是什么原因导致了这个问题的出现呢?原因是ff的一个安全策略导致的。该策略限制了HTML文件访问不在根目录下的文件夹中的web fonts。这种限制只在本地开发环境下,同时web fonts并未从远程获取时出现。若fonts文件夹被放置在了项目的根目录下。这样即使不去改变上述安全策略,也是可以正常显示的。

还有一些异常状况,以后再慢慢补充。

参考解决方案:http://www.th7.cn/web/html-css/201502/82548.shtml

firefox浏览器无法显示bootstrap图标问题总结的更多相关文章

  1. firefox(ff)下无法显示bootstrap图标问题的解决方案(转)

    原文链接: http://www.th7.cn/web/html-css/201502/82548.shtml 后在网上搜到了解决方案,在此分享以供各位遇到问题的同好参考:在ff的地址栏中输入“abo ...

  2. firefox浏览器中 bootstrap 静态弹出框中select下拉框不能弹出(解决方案)

    问题出现场景1: 在firefox浏览器中在bootstrap弹出的modal静态框中再次弹出一个静态框时 select下拉框不能弹出选项 解决方案:去掉最外层静态框的 tabindex=" ...

  3. (转)如何让ActiveXObject( "Microsoft.XmlDom ")对象在非IE浏览器下显示数据?firefox(火狐)

    如何让ActiveXObject( "Microsoft.XmlDom ")对象在非IE浏览器下显示数据?firefox(火狐) 2013-09-10 16:01 2152人阅读 ...

  4. Webdriver启动Firefox浏览器后,页面显示空白

    在使用pycharm码代码时编译总是出错,后来验证发现浏览器启动后出现问题.白白耗了我2个小时.我把我的解决方案写出来,希望对大家有帮助. 1.现象:起初安装的时候总是能正常运行,有一天突然发现Web ...

  5. Linux(ubuntu)下手动安装 firefox 6 并且添加快捷方式图标

    Mozilla 正式发布了Firefox 6,如果你的电脑上还在用非常古老的版本么,赶紧过来更新下吧,由于官网上面只是提供了linux下的.bz2的压缩包,没有deb或者rmp格式,所以需要自己安装下 ...

  6. Kali Linux Web渗透测试手册(第二版) - 1.1 - Firefox浏览器下安装一些常用的插件

    一.配置KALI Linux和渗透测试环境 在这一章,我们将覆盖以下内容: l  在Windows和Linux上安装VirtualBox l  创建一个Kali Linux虚拟机 l  更新和升级Ka ...

  7. FireFox浏览器的about:config参数大全及其具体用途介绍

    FireFox浏览器的about:config参数大全及其具体用途介绍,注意:这还远不是所有的about:config参数,由于设置参数太多,官方也只提供英文版本的说明,这里提供的FireFox ab ...

  8. 基于Metronic的Bootstrap开发框架经验总结(10)--优化Bootstrap图标管理

    在基于Bootstrap开发的项目中,鲜艳颜色的按钮,以及丰富的图表是很吸引人的特点,为了将这个特点发挥到极致,可以利用Bootstrap图标抽取到数据库里面,并在界面中进行管理和使用,这样我们可以把 ...

  9. 托管到github上的网页图片在百度浏览器中显示不全

    这几天做了个较完整的网页放到github上,上传后看网页效果. 在Firefox浏览器中,显示正常. 在百度浏览器中,空了一大块位置(图片位置),偏偏只空了这一块,其它地方的图片都好好的. 点击f12 ...

随机推荐

  1. 转:IOC框架

    CSND上看了王泽滨的博客关于IOC的,觉得说的很透彻,地址为:http://blog.csdn.net/wanghao72214/article/details/3969594 1 IoC理论的背景 ...

  2. tp5 中 model 的修改器

    修改器可以在数据赋值的时候自动进行转换处理 class User extends Model { public function setNameAttr($value){ return strtolo ...

  3. SerialPort 串口开发

    private SerialPort sPort = new SerialPort(); //串行端口资源 /// <summary> /// 函数功能:打开串口/关闭串口 /// < ...

  4. java.io.Serializable 序列化接口

    什么是序列化.反序列化? Serialization(序列化)是一种将对象以一连串的字节描述的过程: 反序列化deserialization是一种将这些字节重建成一个对象的过程. 序列化通俗一点说就是 ...

  5. Vue学习笔记(一)

    组件:分三步 创建组件: var myComponent = Vue.extend({ template:'<div>This is my first component</div& ...

  6. R语言自动化

    plyr dplyr reshape2(数据整理) boxplot.stats(异常值检测) ggplot2(可视化) knitr(生成报告)

  7. AOP 面向切面编程, Attribute在项目中的应用

    一.AOP(面向切面编程)简介 在我们平时的开发中,我们一般都是面对对象编程,面向对象的特点是继承.多态和封装,我们的业务逻辑代码主要是写在这一个个的类中,但我们在实现业务的同时,难免也到多个重复的操 ...

  8. Flume(2)组件概述与列表

    上一节搭建了flume的简单运行环境,并提供了一个基于netcat的演示.这一节继续对flume的整个流程进行进一步的说明. 一.flume的基本架构图: 下面这个图基本说明了flume的作用,以及f ...

  9. Knockout.js随手记(6)

    实时反映对象属性的变化 在前一篇博客中我们使用了如下代码去新增user对象,即push方法: $("#btnAddUser").click(function () { vm.use ...

  10. jshint 一些选项(转载)

    内容来自: http://www.cnblogs.com/qianduanjingying/p/6185793.html 一些变量的作用: http://www.cnblogs.com/CloudMu ...