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 相关文章推荐
验证javascript中Object和Function的关系的三段简单代码
Jun 27 Javascript
Javascript的数组与字典用法与遍历对象的属性技巧
Nov 07 Javascript
浅析onsubmit校验表单时利用ajax的return false无效问题
Jul 10 Javascript
Js判断CSS文件加载完毕的具体实现
Jan 17 Javascript
js 判断js函数、变量是否存在的简单示例代码
Mar 04 Javascript
jquery实现动态操作select选中
Feb 11 Javascript
JS定义网页表单提交(submit)的方法
Mar 20 Javascript
原生js和jquery实现图片轮播淡入淡出效果
Apr 23 Javascript
详解AngularJS控制器的使用
Mar 09 Javascript
Servlet3.0与纯javascript通过Ajax交互的实例详解
Mar 18 Javascript
在Node.js下运用MQTT协议实现即时通讯及离线推送的方法
Jan 24 Javascript
微信小程序canvas分享海报功能
Oct 31 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 date()日期时间函数详解
2010/05/16 PHP
php生成随机密码的三种方法小结
2010/09/04 PHP
ThinkPHP模板Switch标签用法示例
2014/06/30 PHP
php实现数据库的增删改查
2017/02/26 PHP
jQuery学习笔记之Helloworld
2010/12/22 Javascript
基于jQuery实现的水平和垂直居中的div窗口
2011/08/08 Javascript
node.js中的fs.chownSync方法使用说明
2014/12/16 Javascript
javascript 数组操作详解
2015/01/29 Javascript
js实现适用于素材网站的黑色多级菜单导航条效果
2015/08/24 Javascript
js淡入淡出焦点图幻灯片效果代码分享
2015/09/08 Javascript
浅析JavaScript Array和string的转换(推荐)
2016/05/20 Javascript
jqPlot jQuery绘图插件的使用
2016/06/18 Javascript
jQuery插件passwordStrength密码强度指标详解
2016/06/24 Javascript
angular route中使用resolve在uglify压缩后问题解决
2016/09/21 Javascript
Windows下使用Nodejs运行js的方法
2017/09/02 NodeJs
JS异步函数队列功能实例分析
2017/11/28 Javascript
vue项目中jsonp跨域获取qq音乐首页推荐问题
2018/05/30 Javascript
原生JS实现$.param() 函数的方法
2018/08/10 Javascript
[39:53]完美世界DOTA2联赛PWL S2 LBZS vs Forest 第一场 11.19
2020/11/19 DOTA
Python统计列表中的重复项出现的次数的方法
2014/08/18 Python
python获取当前日期和时间的方法
2015/04/30 Python
Python中的sort()方法使用基础教程
2017/01/08 Python
python读取word文档,插入mysql数据库的示例代码
2018/11/07 Python
django将数组传递给前台模板的方法
2019/08/06 Python
Python中Selenium库使用教程详解
2020/07/23 Python
python利用线程实现多任务
2020/09/18 Python
python爬取天气数据的实例详解
2020/11/20 Python
python 实时调取摄像头的示例代码
2020/11/25 Python
CSS3动画animation实现云彩向左滚动
2014/05/09 HTML / CSS
学生学习总结的自我评价
2013/10/22 职场文书
会计学应届毕业生推荐信
2013/11/04 职场文书
信息管理应届生求职信
2014/03/07 职场文书
规划编制实施方案
2014/03/15 职场文书
六一儿童节活动总结
2014/08/27 职场文书
初中生散播谣言检讨书
2014/11/17 职场文书
2019年大学毕业生个人自我鉴定范文大全
2019/03/21 职场文书