Bootstrap には、グリフアイコン ハーフリングセットから 260 の の glyphicon が組み込まれています。
グリフアイコンは、テキスト、ボタン、ツールバー、ナビゲーション、フォームなどで使用することができします。
下に、グリフアイコンの一部の例を示します:
Envelope glyphicon:
Print glyphicon:
Search glyphicon:
Download glyphicon:
グリフアイコンは、次の構文を使用して挿入します:
<span class="glyphicon glyphicon-name"></span>
上記構文の name 部分は、適切なグリフアイコン名で置き換えなければなりません。
次の例は、グリフアイコンを使用するためのいろいろな方法を示しています:
<p>Envelope icon: <span class="glyphicon glyphicon-envelope"></span></p>
<p>Envelope icon as a link:
<a href="#"><span class="glyphicon
glyphicon-envelope"></span></a>
</p>
<p>Search icon: <span
class="glyphicon glyphicon-search"></span></p>
<p>Search icon on a
button:
<button type="button" class="btn btn-default">
<span
class="glyphicon glyphicon-search"></span> Search
</button>
</p>
<p>Search icon on a styled button:
<button type="button" class="btn
btn-info">
<span class="glyphicon glyphicon-search"></span> Search
</button>
</p>
<p>Print icon: <span class="glyphicon glyphicon-print"></span></p>
<p>Print icon on a styled link button:
<a href="#" class="btn btn-success
btn-lg">
<span class="glyphicon glyphicon-print"></span> Print
</a>
</p>
Try it Yourself »Exercise 1 » Exercise 2 » Exercise 3 »
すべてのグリフアイコンの完全なリファレンスについては、 Bootstrap グリフアイコン・リファレンスをご覧ください。