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 相关文章推荐
用AJAX返回HTML片段中的JavaScript脚本
Jan 04 Javascript
工作需要写的一个js拖拽组件
Jul 28 Javascript
用Mootools获得操作索引的两种方法分享
Dec 12 Javascript
jquery动态更换设置背景图的方法
Mar 25 Javascript
Ajax清除浏览器js、css、图片缓存的方法
Aug 06 Javascript
js中substring和substr两者区别和使用方法
Nov 09 Javascript
微信小程序 获取当前地理位置和经纬度实例代码
Dec 05 Javascript
浅谈React中组件间抽象
Jan 27 Javascript
Vuejs在v-for中,利用index来对第一项添加class的方法
Mar 03 Javascript
基于Vue自定义指令实现按钮级权限控制思路详解
May 23 Javascript
JS常见内存泄漏及解决方案解析
May 30 Javascript
微信小程序仿抖音短视频切换效果的实例代码
Jun 24 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实现快速排序的三种方法分享
2014/03/12 PHP
PHP调用wsdl文件类型的接口代码分享
2014/11/19 PHP
php数组函数array_key_exists()小结
2015/12/10 PHP
PHP数组实际占用内存大小原理解析
2020/12/11 PHP
JavaScript创建命名空间(namespace)的最简实现
2007/12/11 Javascript
JavaScript CSS修改学习第二章 样式
2010/02/19 Javascript
getJSON调用后台json数据时函数被调用两次的原因猜想
2013/09/29 Javascript
jquery选择器-根据多个属性选择示例代码
2013/10/21 Javascript
简介JavaScript中search()方法的使用
2015/06/06 Javascript
js实现异步循环实现代码
2016/02/16 Javascript
jquery的checkbox,radio,select等方法小结
2016/08/30 Javascript
Vue.js 2.0 和 React、Augular等其他前端框架大比拼
2016/10/08 Javascript
JavaScript实现的微信二维码图片生成器的示例
2016/10/26 Javascript
JS动态生成年份和月份实例代码
2017/02/04 Javascript
Vue监听数据对象变化源码
2017/03/09 Javascript
Vue 2.0学习笔记之使用$refs访问Vue中的DOM
2017/12/19 Javascript
教你如何用node连接redis的示例代码
2018/07/12 Javascript
JavaScript实现邮箱后缀提示功能的示例代码
2018/12/13 Javascript
puppeteer库入门初探
2019/01/09 Javascript
30分钟精通React今年最劲爆的新特性——React Hooks
2019/03/11 Javascript
微信小程序如何使用globalData的方法
2019/06/06 Javascript
vue 更改连接后台的api示例
2019/11/11 Javascript
vue开发chrome插件,实现获取界面数据和保存到数据库功能
2020/12/01 Vue.js
Vue 修改网站图标的方法
2020/12/31 Vue.js
用Python的SimPy库简化复杂的编程模型的介绍
2015/04/13 Python
python实现将excel文件转化成CSV格式
2018/03/22 Python
详解Python3的TFTP文件传输
2018/06/26 Python
python 常用的基础函数
2018/07/10 Python
利用python实现简易版的贪吃蛇游戏(面向python小白)
2018/12/30 Python
python利用google翻译方法实例(翻译字幕文件)
2020/09/21 Python
小程序canvas中文字设置居中锚点
2019/04/16 HTML / CSS
美国最大的船只买卖在线市场:Boat Trader
2018/08/04 全球购物
医学护理毕业生自荐信
2013/11/07 职场文书
毕业证丢失证明
2014/01/15 职场文书
幼儿园中班教学反思
2014/02/10 职场文书
物业品质提升方案
2014/06/08 职场文书