Bootstrap中应用图标不显示怎么回事
导读：这篇文章给大家分享的是“Bootstrap中应用图标不显示怎么回事”，文中的讲解内容简单清晰，对大家学习和理解有一定的参考价值和帮助，有这方面学习需要的朋友，接下来就跟随小编一起学习一下“Bootstrap中应用图标不显示怎么回事”吧。...
这篇文章给大家分享的是“Bootstrap中应用图标不显示怎么回事”，文中的讲解内容简单清晰，对大家学习和理解有一定的参考价值和帮助，有这方面学习需要的朋友，接下来就跟随小编一起学习一下“Bootstrap中应用图标不显示怎么回事”吧。bootstrap图标不显示的解决办法：首先把从网上下载的整个bootstrap放到eclipse中；然后把jQuery的引用放在bootstrap引用前即可。
本教程操作环境：Windows7系统、bootsrap3.3.7版，该方法适用于所有品牌电脑。
Bootstrap字体图标不显示问题
问题:
bootstrap使用字体图标时只显示一个框，不显示图标。
问题分析：
出现的原因是：bootstrap.css文件没有正确关联上字体文件glyphicons-halflings-regular.eot。
查看bootstrap.css源码可知：
`@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.woff2') format('woff2'), 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');
}
`注意当中的url
解决办法：
把从网上下载的整个bootstrap丢到eclipse中。如图
在jsp页面中的引用：
head>
meta http-equiv="Content-Type" content="text/html;
charset=ISO-8859-1">
title>
bootStrap表单/title>
script type="text/javascript" src="js/jquery.min.js">
/script>
link rel="stylesheet" href="js/bootstrap-3.3.7-dist/css/bootstrap.css">
script type="text/javascript" src="js/bootstrap-3.3.7-dist/js/bootstrap.js">
/script>
/head>
注意：jQuery的引用要放在bootstrap引用前，否则会报Uncaught Error: Bootstrap's JavaScript requires jQuery的错误
现在大家对于Bootstrap中应用图标不显示怎么回事的内容应该都清楚了吧，希望大家阅读完这篇文章能有所收获。最后，想要了解更多Bootstrap中应用图标不显示怎么回事的知识，欢迎关注网络，网络将为大家推送更多相关知识点的文章。
声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！
若转载请注明出处： Bootstrap中应用图标不显示怎么回事
本文地址： https://pptw.com/jishu/653993.html