圖標不顯示在輸入字段的屏幕上

我有下面的代碼，我想顯示一個引導程序圖標，而不是一個按鈕。任何想法我做錯了什麼？圖標不顯示在輸入字段的屏幕上

<input type="submit" value="Update" class="btn btn-default btn-update" />

我試了下面，它不工作，任何想法如何解決它？

<input type="submit" value="Update" class="glyphicon glyphicon-remove" />

而且這樣的：

<input type="submit" value="Update" class="btn btn-default glyphicon glyphicon-remove" />

來源

2014-06-10 shopia T

每Bootstrap docs：

不要與其它成分混合。圖標類不能直接與其他組件組合。它們不應該與其他類一起使用。相反，添加一個嵌套的<span>和將圖標類應用到<span>。

所以嘗試：

<button type="submit" class="btn btn-default btn-lg"> 
<span class="glyphicon glyphicon-remove"></span>Update</button>

bootply example

來源

2014-06-10 13:30:37 j08691

Thakns，投票了，但我也有矩形的按鈕，我只想圖標（應該用作按鈕...）任何想法？ –

像這樣http://www.bootply.com/GxKu0Nq1pV？ – j08691

謝謝，但這是行不通的，我仍然看到按鈕內的圖標... –

由於輸入標籤不能持有任何其他HTML，要做到這一點，正確的方法是使用按鈕標籤：

<button type="submit" class="btn btn-default"><i class="glyphicon glyphicon-remove"></i> Update</button>

Example in documentation

Demo

來源

2014-06-10 13:30:53

謝謝，我應該如何刪除按鈕的矩形，我只想圖標... –

CSS

input[type=submit] { 
     background: url(where_your_image_is); 
     border: 0; 
     display: block; 
     height: _the_image_height; 
     width: _the_image_width; 
    }

<input type="image" src="/yourImage" width ="" height="" border="0" />

來源

2014-06-10 13:36:50

首先下載引導文件夾： https://github.com/twbs/bootstrap/releases/download/v3.1.1/bootstrap-3.1.1-dist.zip

提取出來，並上傳你的服務器上的文件不是添加到您的頁眉：

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"> 
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css"> 
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>

來源

2014-06-10 13:41:29 user3723866

圖標不顯示在輸入字段的屏幕上

回答

相關問題