引導中的標籤和徽章

Question

通過使用引導程序，我想顯示綠色和紅色標籤，其上下文就像v或x。

v應該是綠色的，x應該是紅色的。

我寫了下面的代碼，但我想有更好的效果。

<span class="badge badge-success">V</span> 
<span class="badge badge-important">X</span> 

任何想法，我應該如何通過使用bootstrap？

這裏是我將通過使用引導標籤和徽章得到的例子。

Answer 1

如果結合使用字體真棒（http://fortawesome.github.com/Font-Awesome/）與Twitter的引導（其中它的設計），你將能夠做這樣的事情：

<i class="icon-ok-sign" style="color: green; font-size: 18pt;"></i> 
<i class="icon-remove-sign" style="color: red; font-size: 18pt;"></i> 
<br/><br/> 

<i class="icon-ok-circle" style="color: green; font-size: 18pt;"></i> 
<i class="icon-remove-circle" style="color: red; font-size: 18pt;"></i> 
<br/><br/> 

<i class="icon-ok" style="color: green; font-size: 14pt;"></i> 
<i class="icon-remove" style="color: red; font-size: 14pt;"></i> 

這會輸出：

或者您可以使用別處定義的CSS類來適當地設置它們的樣式。

字體真棒基於SVG圖像，並且可以縮放到任何尺寸（在合理的範圍內）。
您現在還可以將您需要的圖標集合在一起，而不是默認使用icnfnt來包含它們。