JSボタン(button.js)
あなたは、ボタンをさらに制御したい場合は、このプラグインを使用します。
ボタンについてのチュートリアルでは、私たちの読みBootstrapボタンのチュートリアルを 。
ボタンのプラグインクラス
以下のクラスは、任意のスタイルを使用することができ<a>, <button> 、または<input>要素を：
| クラス | 説明 | 例 |
|---|---|---|
| .btn | 任意のボタンに基本的なスタイリングを追加します。 | それを試してみてください |
| .btn-default | デフォルト/標準ボタンを示します | それを試してみてください |
| .btn-primary | 余分な視覚的な重量を提供し、ボタンのセットでプライマリアクションを識別する | それを試してみてください |
| .btn-success | 成功または積極的な行動を示しています | それを試してみてください |
| .btn-info | 情報アラートメッセージのコンテキストボタン | それを試してみてください |
| .btn-warning | 注意このアクションで撮影されるべきであることを示します | それを試してみてください |
| .btn-danger | 危険または潜在的に負の作用を示します | それを試してみてください |
| .btn-link | ボタンが（まだボタンの動作を持っています）リンクのように見えるのです | それを試してみてください |
| .btn-lg | 大きなボタンを作ります | それを試してみてください |
| .btn-sm | 小さなボタンを作ります | それを試してみてください |
| .btn-xs | 余分な小さなボタンを作ります | それを試してみてください |
| .btn-block | ブロックレベルのボタンが（親要素の幅全体にまたがる）になります | それを試してみてください |
| .active | ボタンが押された見えます | それを試してみてください |
| .disabled | ボタンは無効になります | それを試してみてください |
JavaScriptを介して、
手動で有効にします。
$('.btn').button();
ボタンのオプション
| None |
ボタンのメソッド
次の表は、使用可能なすべてのボタンのメソッドを示します。
注：このプラグインのために、方法は、データの属性を介して渡すことができます。 データトグルまたはデータロードのように、データーにメソッド名を追加します。
| 方法 | 説明 | それを試してみてください |
|---|---|---|
| .button("toggle") | 押されたボタンの外観を作ります | それを試してみてください |
| .button("loading") | ボタンを無効とするボタンのテキストに変更 "ロードを..." | それを試してみてください |
| .button("reset") | （変更した場合）、元のテキストへのボタンのテキストを変更します | それを試してみてください |
| .button("string") | 新しいボタンのテキストを指定します。 | それを試してみてください |
例
ボタンをカスタマイズするためにCSSを使用しました
丸みを帯びた境界線を削除する方法：
特定の色を追加する方法：
例
.btn-default {
background: #000;
color: #fff;
}
.btn-default:hover {
background: #fff;
color: #000;
} »それを自分で試してみてください 影を追加する方法：