beautons.cssを使うことで、画像不使用のBootstrap風のフラットできれいなボタンを簡単に実装できます。<head>で「beautons.css」を次のように読み込んでおき、
<link href="css/beautons.css" rel="stylesheet">後は、ボタンを設定する要素にclass指定するだけです。
ボタンA1（基本）：「class="btn"」、ボタンA2：「class="btn btn--small"」、ボタンA3：「class="btn btn--large"」、ボタンA4：「class="btn btn--huge"」、ボタンA5：「class="btn btn--full"」
ボタンの色は、styleで指定します。
ボタンB1：style="background:green;"、ボタンB2：style="background:deeppink;"、ボタンB3：style="background:#191970;"、ボタンB4：style="background:#7a107a;"
フォントサイズは、classで指定します。フォントサイズに合わせて、ボタンもサイズが変わります。
ボタンC1：「class="btn btn--alpha"」、ボタンC2：「class="btn btn--beta"」、ボタンC3：「class="btn btn--gamma"」
ファンクション用ボタンは、classで指定します。
ボタンD1（ダウンロードやログインなど）：「class="btn btn--positive"」、
ボタンD2（削除やunfriendなど）：「class="btn btn--negative"」、
ボタンD3（無効なボタン）：class=「"btn btn--inactive"」
ボタンの角丸を、classで指定して2パターン追加できます。
ボタンE1（より丸く）：「class="btn btn--soft"」、
ボタンE2（丸みをごく少なく）：「class="btn btn--hard"」
ボタンの構成要素であるclassを組み合わせることで、バリエーションを増やすことができます。
ボタンF1：「class="btn btn--large btn--positive"」、
ボタンF2：「class="btn btn--negative btn--full btn--soft"」
ボタンF3（文章の中でボタンを表す場合）：「class="btn btn--natural"」