ボタンをつくってみるBootStrap

よくつかうクラスにボタンがあるかと思うので、

備忘録的に記載。

参考にさせていただいたサイト様はこちらです。

Bootstrap サンプル

Bootstrapに用意されているクラス【ボタン編】

aタグ等に[btn]クラスをつけて、

各目的ごとにカラースタイルをつけます。

例えば、こんな感じ。

<a href="#" class="btn btn-default">通常</a>

ということで、全色は、こんな感じのようです。

<a href="#" class="btn btn-default">通常</a>
<a href="#" class="btn btn-primary">重要</a>
<a href="#" class="btn btn-success">成功</a>
<a href="#" class="btn btn-info">情報</a>
<a href="#" class="btn btn-warning">警告</a>
<a href="#" class="btn btn-danger">危険</a>
<a href="#" class="btn btn-link">リンク</a>

サイズも選べます。

btn-lg、btn-sm、btn-xs

デフォルトは、指定なしです。

btn-blockを指定すれば、横幅いっぱいにひろげてくれるので、

なかなか便利です。