<a href="#" class="%{STYLEGUIDE_PAGE}-btn">レギュラー</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-flat">フラット</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-admin">デフォルト</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-admin %{STYLEGUIDE_PAGE}-btn-admin-primary">Primary</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-admin %{STYLEGUIDE_PAGE}-btn-admin-info">Info</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-admin %{STYLEGUIDE_PAGE}-btn-admin-danger">Danger</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-admin %{STYLEGUIDE_PAGE}-btn-admin-primary %{STYLEGUIDE_PAGE}-btn-admin-save">保存用</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-admin %{STYLEGUIDE_PAGE}-btn-admin-info %{STYLEGUIDE_PAGE}-btn-admin-search">検索用</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn">デフォルト</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn %{STYLEGUIDE_PAGE}-btn-primary">Primary</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn %{STYLEGUIDE_PAGE}-btn-info">Info</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn %{STYLEGUIDE_PAGE}-btn-success">Success</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn %{STYLEGUIDE_PAGE}-btn-warning">Warning</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn %{STYLEGUIDE_PAGE}-btn-danger">Danger</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn %{STYLEGUIDE_PAGE}-btn-link">Link</a>
<a class="%{STYLEGUIDE_PAGE}-btn" href="#">リンク</a>
<button class="%{STYLEGUIDE_PAGE}-btn" type="submit">ボタン</button>
<input class="%{STYLEGUIDE_PAGE}-btn" type="button" value="インプット">
<input class="%{STYLEGUIDE_PAGE}-btn" type="submit" value="サブミット">
<a href="#" class="%{STYLEGUIDE_PAGE}-btn">regular</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn %{STYLEGUIDE_PAGE}-btn-hover">hover</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn %{STYLEGUIDE_PAGE}-btn-active">active</a>
用意したもの4種類
<a href="#" class="%{STYLEGUIDE_PAGE}-btn %{STYLEGUIDE_PAGE}-btn-small">small</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn">normal</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn %{STYLEGUIDE_PAGE}-btn-large">large</a>
<button type="button" class="%{STYLEGUIDE_PAGE}-btn %{STYLEGUIDE_PAGE}-btn-block">全幅のサイズ</button>
disabled.%{STYLEGUIDE_PAGE}-btn-disabledのもの
<button type="button" class="%{STYLEGUIDE_PAGE}-btn" disabled="disabled">disabled</button>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn %{STYLEGUIDE_PAGE}-btn-disabled">クラス名がdisabled</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-flat">デフォルト</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-flat %{STYLEGUIDE_PAGE}-btn-flat-primary">Primary</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-flat %{STYLEGUIDE_PAGE}-btn-flat-info">Info</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-flat %{STYLEGUIDE_PAGE}-btn-flat-success">Success</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-flat %{STYLEGUIDE_PAGE}-btn-flat-warning">Warning</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-flat %{STYLEGUIDE_PAGE}-btn-flat-danger">Danger</a>
<a class="%{STYLEGUIDE_PAGE}-btn-flat" href="#">リンク</a>
<button class="%{STYLEGUIDE_PAGE}-btn-flat" type="submit">ボタン</button>
<input class="%{STYLEGUIDE_PAGE}-btn-flat" type="button" value="インプット">
<input class="%{STYLEGUIDE_PAGE}-btn-flat" type="submit" value="サブミット">
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-flat">regular</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-flat %{STYLEGUIDE_PAGE}-btn-hover">hover</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-flat %{STYLEGUIDE_PAGE}-btn-active">active</a>
用意したもの4種類
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-flat %{STYLEGUIDE_PAGE}-btn-small">小さいサイズ</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-flat">通常サイズ</a>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-flat %{STYLEGUIDE_PAGE}-btn-large">大きいサイズ</a>
<button type="button" class="%{STYLEGUIDE_PAGE}-btn-flat %{STYLEGUIDE_PAGE}-btn-block">全幅のサイズ</button>
disabled.%{STYLEGUIDE_PAGE}-btn-disabled
<button type="button" class="%{STYLEGUIDE_PAGE}-btn-flat" disabled="disabled">属性がdisabled</button>
<a href="#" class="%{STYLEGUIDE_PAGE}-btn-flat %{STYLEGUIDE_PAGE}-btn-disabled">クラス名がdisabled</a>