すべてのボタンにグリフコンを追加する（ブートストラップ3.5）

Question

すべてのデフォルトボタンのテキストの後ろにグリフコンを追加したいと思います。

私はここにリストにglyphiconを含める方法が見つかりました： Using a Glyphicon as an LI bullet point

私はボタンにこれを適用しようとしたが、私は私が私のようにそれを追加することができます実現右

.btn-default button:after { 
    content: "\e080"; 
    font-family: 'Glyphicons Halflings'; 
    font-size: 9px; 
    float: left; 
    margin-top: 4px; 
    margin-left: -17px; 
    color: #0099FF; 
} 

それを持っていませんこれは：

<a class="btn btn-default" href="testpage.aspx"> 
    Learn more 
    <span class="glyphicon glyphicon-chevron-right"></span> 
</a> 

ただし、毎回追加する必要はありません。私も色を設定したいと思います。

Answer 1

Iの事。そのために

あなただけのシンプルなCSSを記述する必要があります。Class CSSの後にテキストの後に、すべてのデフォルトボタンに適用するには：

.btn-default:after { 
    content: "\e080"; 
    font-family: 'Glyphicons Halflings'; 
    font-size: 9px; 
    vertical-align: middle; 
    padding: 6px 5px; 
    color: #0099FF; 
} 

画像に示すように、これはあなたのすべてのボタンのために動作します。

Answer 2

私は、これはそれを行うための正しい方法であることを理解：

<span class="glyphicon glyphicon-chevron-right"></span> 

だけselectorを使用してclassまたは参照スパンを追加し、CSSで色を与え、それを別の色を与えるために。あなたはすべてのボタン用の画像出力の上に望んでいるかもしれません

.color-red { 
    color:#FF0000; 
}