bootstrap引入的字體圖標(biāo)無法顯示原因有兩個(gè)。
一、版本問題
bootstrap新版本4.5，無法顯示圖標(biāo)
它的顯示效果是這樣的：
這種情況我們就需要更換版本啦~
在bootstrap官網(wǎng)：https://v3.bootcss.com/ 下載新的版本3.3.7
操作：
1、打開官網(wǎng) https://v3.bootcss.com/
2、下載bootstrap3.3.7
步驟：
3、解壓完成
4、引用
二、引用問題
在不能正常顯示的時(shí)候，比如我要在一個(gè)按鈕中使用一個(gè)“博士帽”的字體圖標(biāo)，我的代碼是這樣子的：
因?yàn)槲野裝ootstrap.css文件和html放在同一級(jí)目錄下
這時(shí)候?yàn)g覽器是表示無法獲取文件的，會(huì)這樣顯示：
字體圖標(biāo)的樣式，是關(guān)聯(lián)著這些文件的，進(jìn)入到下載的整個(gè)的壓縮包，進(jìn)入這個(gè)文件bootstrap-3.3.7-dist\fonts，就會(huì)發(fā)現(xiàn)如下文件：
必須要關(guān)聯(lián)到glyphicons-halflings-regular.eot等文件才能正常使用。
而在我的引用bootstrap文件中，我是這樣引用的，可能你也正在犯跟我一樣的錯(cuò)誤：
<link rel="stylesheet" href="bootstrap.css">
在使用bootstrap的大多樣式的時(shí)候，單單是bootstrap.css這個(gè)文件就夠了，不必引入全部的，這樣可以讓我們的項(xiàng)目沒那么臃腫。但是在我們使用字體圖標(biāo)的時(shí)候，是需要關(guān)聯(lián)到字體圖標(biāo)相關(guān)的文件才得以實(shí)現(xiàn)的，所以當(dāng)我引入整個(gè)bootstrap-3.3.7（您也可以部分引入，只要將你想要的功能的相關(guān)文件全部引入且目錄無誤即可），然后再在我的html中這樣引入：
<link rel="stylesheet" href="../libs/bootstrap-3.3.7/css/bootstrap.css">
這樣就能正常顯示了~
