Bootstrap 3 Glyphicons無法正確顯示

Question

到目前為止，我沒有太多的問題來獲取引導程序，但是今晚我嘗試將glyphicons集成到navbar元素中，但無法使其正常工作。 該圖顯示了出現在字形圖標位置的字符； 下面的代碼。

<link href="/userpath/code/js/bootstrap-3.3.1/dist/css/bootstrap.min.css" rel="stylesheet">

<!-- Bootstrap theme -->
<link href="/userpath/code/js/bootstrap-3.3.1/dist/css/bootstrap-theme.min.css" rel="stylesheet">

<!-- Custom styles for this template -->
<link href="style.css" rel="stylesheet">
 <nav class="navbar navbar-default navbar-fixed-top">
  <div class="container">
    <div class="navbar-header">
      <a class="navbar-brand" href="#">name</a>
    </div>
    <ul class="nav navbar-nav">
      <li><a href="#">  About Me</a></li>
      <li><a class="navbar-link" href="#"><span class="glyphicon glyphicon-star" aria-hidden="true"></span>  Projects</a></li>
      <li><a href="#">  Past</a></li>
      <li><a href="#">  Free Time</a></li>
    </ul>
  </div>
</nav>

我首先像任何理智的人一樣整理BS3文檔，然后發現了這一點。

僅用於空元素：圖標類僅應用於不包含文本內容且不包含子元素的元素。

我對此並不感到100％滿意，我發現了許多示例，這些示例在按鈕對象中顯示了圖標。 一個演示在這里 。 這使我相信我的問題超出了與BS3的兼容性。 我繼續尋找，發現這篇有用的文章說要重新下載字體文件的源代碼。 嘗試此操作后問題仍然存在。 我還仔細檢查了bootstrap.min.css的格式是否正確。 對於那些仍然可能認為這是導航欄問題的人，我嘗試實現了演示中看到的按鈕，但仍然存在相同的問題。

我是否需要在.css中顯式格式化字形？ 從我所讀的內容中，我已經具備了正常工作所需的一切。 請讓我知道我在做什么錯。

對於那些在乎的人，我在Mac Book Pro OSX 10.9.5上使用Mozilla 34.0.5（不是操作系統應該很重要）。

更新

我嘗試了Shikar的建議，但無法使它們起作用。 當我查看bootstrap.min.css時，看到了src:url(../fonts/glyphicons...) 。 我做了兩次嘗試來更改這些URL。 首先，我只是刪除了/fonts/之前的.. 這沒有改變。 然后我意識到我已經將引導程序放在了一個單獨的目錄中，因此我通過將`/Users/myname/explicitPath/bootstrap-3.3.1/dist/fonts/glyphicons-halflings-regular.eot）與.css區域中提到的其他四個glyphicon網址。 這也沒有用。 在@rockerest的建議下，我查看了FF的webdev工具，並看到兩次下載字體可下載的失敗。 這些錯誤的文件路徑沒有任何錯誤，但是我是否誤解了如何在本地使用引導程序？ 我不能在bootstrap.min.css中使用本地文件路徑嗎？

Answer 1

因此，我的問題最終出現在與我的index.html相關的引導程序所在的位置。 以下是之前和之后的文件結構。 我希望只有一個通用的Bootstrap文件夾，可以指向開發多個Web應用程序構想的文件，但是看起來引導帶必須與index.html處於同一級別。 通過將引導程序移到與index.html相同的目錄中，在引導程序目錄中執行grunt dist並使用.html引用中的bootstrap.min.css的顯式路徑，我可以使事情正常進行。 希望我對此有一個更好的理解。

Before                    After
├── webpage/              └── webpage/
|   └──index.html             ├──index.html
|                             └──bootstrap/
└── js/
    └──bootstrap/

Answer 2

有一個類似的問題，解決了將fonts目錄放在css文件夾所在的目錄中的問題。 例如，如果將css文件夾放置在根目錄中，則將fonts文件夾放置在根目錄中。