masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu
Rumah > hujung hadapan web > Tutorial Bootstrap > 如何解决bootstrap 图标不显示的问题

如何解决bootstrap 图标不显示的问题

藏色散人
Lepaskan： 2021-01-08 14:36:14
asal
6040 orang telah melayarinya

bootstrap图标不显示的解决办法：首先把从网上下载的整个bootstrap放到eclipse中；然后把jQuery的引用放在bootstrap引用前即可。

如何解决bootstrap 图标不显示的问题

本教程操作环境：Windows7系统、bootsrap3.3.7版，该方法适用于所有品牌电脑。

推荐：《bootstrap教程》《css视频教程》

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');
}`
Salin selepas log masuk

注意当中的url

解决办法：

把从网上下载的整个bootstrap丢到eclipse中。如图

639e6f081fa13d676b95c95a1404f55.png

在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>
Salin selepas log masuk

注意：jQuery的引用要放在bootstrap引用前，否则会报Uncaught Error: Bootstrap's JavaScript requires jQuery的错误

更多编程相关知识，请访问：编程教学！！

Atas ialah kandungan terperinci 如何解决bootstrap 图标不显示的问题. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan：
bootstrap
sumber：php.cn
Artikel sebelumnya：bootstrap模态框如何提交表单 Artikel seterusnya：bootstrap怎么删除图标
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Isu terkini
Halaman tiba-tiba tidak dapat menarik css atau bootstrap Jadi saya sedang membangunkan halaman, saya telah membuat sebahagian daripadanya semalam d...
daripada 2024-04-06 21:58:04
0
1
800
Bagaimana untuk menyelesaikan ruang kosong misteri di bahagian bawah halaman dalam CSS Saya cuba membina halaman web mudah menggunakan Bootstrap dan D3, tetapi saya tidak tahu b...
daripada 2024-04-06 20:22:15
0
1
454
Sesuaikan penampilan pengepala akordion Bootstrap menggunakan kelas CollapseDisplay Saya ingin menggayakan tajuk kad panel dengan rancangan runtuh kelas. Dalam contoh ini, ia...
daripada 2024-04-06 12:53:11
0
1
376
Suis Bootstrap tidak berfungsi dengan betul apabila halaman web diubah saiznya 这是代码：<navxmlns:sec="http://www.thymeleaf.org/extras/spring-security"class=&qu...
daripada 2024-04-05 08:45:39
0
1
3443
Paparkan fail PDF AWS dalam mod Bootstrap dalam Laravel Saya telah memuat turun url aws seperti https://xxx-xx-dev.s3.ap-south-1.amazonaws.com/std...
daripada 2024-04-04 22:16:18
0
1
1450
Topik-topik yang berkaitan
Lagi>
Cadangan popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan