Bootstrap ボタンの色一覧とその意味

Bootstrapでは目的に応じてボタンの色を指定することができます。

クラス名	色	意味
btn-default	白	デフォルト
btn-primary	青	プライマリ。選択されている状態や規定の項目を表現する。
btn-success	緑	成功
btn-info	水色	情報
btn-warning	オレンジ	警告
btn-danger	赤	危険。エラー

画面で見るとこんな感じになります。

f:id:sho322:20140730215527j:plain

これを表示させるためのソースコードはこちらになります。

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta http-equiv="X-UA-Compatible" content="IE=edge" charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link href="css/bootstrap.min.css" rel="stylesheet">
  <!--[if lt IE 9]>
    <script src="js/html5shiv.js"></script>
    <script src="js/respond.min.js"></script>
  <![endif]-->
  <script src="js/jquery.min.js"></script>
  <script src="js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
<h2>Bootstrapのボタンのサンプル</h2>
  <form action="hoge">
    <button class="btn btn-default">default</button>
    <button class="btn btn-primary">primary</button>
    <button class="btn btn-success">success</button>
    <button class="btn btn-info">info</button>
    <button class="btn btn-warning">warning</button>
    <button class="btn btn-danger">danger</button>
  </form>
</div>

</body>
</html>

＜参考文献＞
UIまで手の回らないプログラマのためのBootstrap 3実用ガイド