font-awesomeテキストフォントを変更するには？

Question

私はボタンでfont-awesomeを使用していますが、フォントの素晴らしいボタンの中にテキストを入れたいと思っています。フォントファミリはフォントワームでなければならないが、それは私が変更できない何らかのセリフフォントを与える。

私は固定

<div class=" btn-toolbar"> 
<div class="btn-group" title="vote"> 
<button class="btn icon-"> 
<span class="icon-thumbs-up"> vote <span class="icon-thumbs-down"> 
</button> 
<button class="btn icon-heart" title="subscribe to get latest updates"></button> 

</div> 
    <div class="btn-group"> 
    <button class="btn icon-edit" title="edit"></button> 
    <button class="btn icon-print" title="print"></button> 

</div> 
    <div class="btn-group"> 
    <button class="btn icon-facebook" title="share on facebook"></button> 
    <button class="btn icon-twitter" title="share on twitter"></button> 
    <button class="btn icon-google-plus" title="share on google+"></button> 


</div> 
</div> 

Answer 1

を上書きするには、次のコードを使用コンテンツ。さらに、非常に深刻な構文エラーがあります。 <span>は自己閉鎖要素ではないため、使用するたびに</span>を実行する必要があります。ドキュメントでは代わりに<i></i>を使用するよう提案されていますが、一部の開発者の気持ちに違反しています。とにかく、この例で使ってみましょう（スパンも同様です）。アイコンとボタンが必要な場合

は、あなたが実行します。

<button class="btn" title="share on facebook"><i class="icon-facebook"></i></button> 

あなたがアイコンの横のテキストを必要とする

は、単にそれ を追加（アイコンの後のスペースに注意してください）。

<button class="btn"><i class="icon-thumbs-up"></i> Like</button> 

複数のアイコンを使用することもできます。

<button class="btn"><i class="icon-thumbs-up"></i> Vote <i class="icon-thumbs-down"></i></button> 

以上の実験のために、このバイオリンを見て：これは、ベストプラクティスかもしれないが、それは適切な答えに値するので、質問がクリーンなコードにつながるhttp://jsfiddle.net/Frizi/h69je/2/

Answer 2

を使用していますコード - あなたはボタンの上に直接アイコンを使用しますが、代わりにそれらを追加しないでください

<span class="icon-thumbs-up"> <span style="font-family:Helvetica Neue, Helvetica, Arial, sans-serif; font-size:12px;" >vote</span> <span class="icon-thumbs-down">