Bootstrap 3.2.0 字形未顯示

Question

我試圖在我的文本框中顯示字形。

這是我的標記：

 <div class="form-group" style="width: 100%;" id="divFirstName" runat="server">
                                        <input type="text" placeholder="First Name" runat="server" id="txtFirstName" value="" aria-describedby="inputSuccess2Status" class="form-control" maxlength="30" />
                                        <span class="glyphicon glyphicon-ok form-control-feedback" aria-hidden="true"></span>
  <span id="inputSuccess2Status" class="sr-only">(success)</span>
                                    </div>

這是我得到的結果：

知道我做錯了什么嗎？

Answer 1

您忘記包含最新的引導 css 樣式。

<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

還要確保您沒有覆蓋 CSS 中某處圖標span的font-family屬性。

Answer 2

對我來說看起來不錯。 您是否包含最新的引導 CSS（當前為 3.3.5）？

<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

此外，您必須將類has-feedback添加到表單組容器中。

這是一個顯示它工作的小提琴： https : //jsfiddle.net/dnje3g1y/

<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

<div class="form-group has-feedback" style="width: 100%;" id="divFirstName" runat="server">

<input type="text" placeholder="First Name" runat="server" id="txtFirstName" value="" aria-describedby="inputSuccess2Status" class="form-control" maxlength="30" />
<span class="glyphicon glyphicon-ok form-control-feedback" aria-hidden="true"></span>
<span id="inputSuccess2Status" class="sr-only">(success)</span>

</div>

Answer 3

由於您正在從本地服務器加載文件，但它們無法正常工作，因此問題出在字體文件和 css 文件的設置方式上。 bootstrap 中的 css 查找向上一個文件夾的字體（文件所在當前目錄的父目錄）。

這是引導文件的設置。 根據文檔。

bootstrap/
├── css/
│   ├── bootstrap.css
│   ├── bootstrap.css.map
│   ├── bootstrap.min.css
├── js/
│   ├── bootstrap.js
│   └── bootstrap.min.js
└── fonts/
    ├── glyphicons-halflings-regular.eot
    ├── glyphicons-halflings-regular.svg
    ├── glyphicons-halflings-regular.ttf
    ├── glyphicons-halflings-regular.woff
    └── glyphicons-halflings-regular.woff2

如果您的文件不是這樣設置的，您可以修改 css 文件以指向您的字體文件的路徑