BootStrap 图标icon符号图标glyphicons不正常显示的快速解决办法


Posted in Javascript onDecember 08, 2016

 bootstrap 图标icon符号图标glyphicons不正常显示解决办法如下所示:

分享供各位参考:

1、在ff/http:的地址栏中输入“about:config”,即进入配置界面。

2、进入后,搜索“security.fileuri.strict_origin_policy”,这是该值应该是true。

3、双击该项,其值自动变为false,即可。

4、修改后,再刷新遇到问题的页面,即可看到正常显示的图标了。

探究问题原因:

1、由于ff/http:一个安全策略导致的。该策略限制了HTML文件访问不在根目录下的文件夹中的web fonts。

2、这种限制只在本地开发环境下,同时web fonts并未从远程获取时出现。

3、后来看了下前面提到的那个没有出现问题的bootstrap项目。

4、果然,其fonts文件夹被放置在了项目的根目录下。

5、这样即使不去改变上述安全策略,也是可以正常显示的。

6、@font-face地址:

@font-face {
font-family: 'Glyphicons Halflings';
src: url('../fonts/glyphicons-halflings-regular.eot');
src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}

以上所述是小编给大家介绍的BootStrap 图标icon符号图标glyphicons不正常显示的快速解决办法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
qTip2 精致的基于jQuery提示信息插件
Feb 17 Javascript
jquery 设置元素相对于另一个元素的top值(实例代码)
Nov 06 Javascript
javascript数字时钟示例分享
Apr 23 Javascript
使用node.js 获取客户端信息代码分享
Nov 26 Javascript
使用JavaScript实现连续滚动字幕效果的方法
Jul 07 Javascript
jQuery EasyUI编辑DataGrid用combobox实现多级联动
Aug 29 Javascript
将angular-ui的分页组件封装成指令的方法详解
May 10 Javascript
js脚本编写简单刷票投票系统
Jun 27 Javascript
vue中实现滚动加载更多的示例
Nov 08 Javascript
通过原生vue添加滚动加载更多功能
Nov 21 Javascript
如何用JavaScipt测网速
May 09 Javascript
HTML+JS实现在线朗读器
Feb 15 Javascript
Bootstrap基本插件学习笔记之Tooltip提示工具(18)
Dec 08 #Javascript
Bootstrap基本插件学习笔记之Alert警告框(20)
Dec 08 #Javascript
Bootstrap基本插件学习笔记之按钮(21)
Dec 08 #Javascript
浅谈Node.js:理解stream
Dec 08 #Javascript
JavaScript组成、引入、输出、运算符基础知识讲解
Dec 08 #Javascript
Bootstrap基本插件学习笔记之折叠(22)
Dec 08 #Javascript
Bootstrap基本插件学习笔记之轮播幻灯片(23)
Dec 08 #Javascript
You might like
PHP set_error_handler()函数使用详解(示例)
2013/11/12 PHP
php实现当前页面点击下载文件的简单方法
2016/09/22 PHP
PHP小偷程序的设计与实现方法详解
2016/10/15 PHP
让焦点自动跳转
2006/07/01 Javascript
关于Jqzoom的使用心得 jquery放大镜效果插件
2010/04/12 Javascript
JavaScript 命名空间 使用介绍
2013/08/29 Javascript
ExtJs中gridpanel分组后组名排序实例代码
2013/12/02 Javascript
js或jquery实现页面打印可局部打印
2014/03/27 Javascript
浅析javascript 定时器
2014/12/23 Javascript
javascript实时显示当天日期的方法
2015/05/20 Javascript
javascript瀑布流式图片懒加载实例解析与优化
2016/02/23 Javascript
jQuery实现的购物车物品数量加减功能代码
2016/11/16 Javascript
详解AngularJS脏检查机制及$timeout的妙用
2017/06/19 Javascript
javascript 玩转Date对象(实例讲解)
2017/07/11 Javascript
Angularjs上传图片实例详解
2017/08/06 Javascript
200行代码实现blockchain 区块链实例详解
2018/03/14 Javascript
vue 框架下自定义滚动条(easyscroll)实现方法
2019/08/29 Javascript
Vue的click事件防抖和节流处理详解
2019/11/13 Javascript
vue项目或网页上实现文字转换成语音播放功能
2020/06/09 Javascript
js 函数性能比较方法
2020/08/24 Javascript
详解Python操作RabbitMQ服务器消息队列的远程结果返回
2016/06/30 Python
Python列出一个文件夹及其子目录的所有文件
2016/06/30 Python
pycharm中使用anaconda部署python环境的方法步骤
2018/12/19 Python
利用arcgis的python读取要素的X,Y方法
2018/12/22 Python
解决python 文本过滤和清理问题
2019/08/28 Python
Python操作Sonqube API获取检测结果并打印过程解析
2019/11/27 Python
Python暴力破解Mysql数据的示例
2020/11/09 Python
python os.listdir()乱码解决方案
2021/01/31 Python
在线吉他课程,学习如何弹吉他:Fender Play
2019/02/28 全球购物
.NET面试题:什么是反射
2016/09/30 面试题
电子商务专业自我鉴定
2013/12/18 职场文书
化工实习心得体会
2014/09/09 职场文书
银行反四风对照检查材料
2014/09/29 职场文书
设备收款委托书范本
2014/10/02 职场文书
工作态度不端正检讨书
2014/10/04 职场文书
win10如何更改appdata文件夹的默认位置?
2022/07/15 数码科技