JS Tombol (button.js)
Gunakan plugin ini jika Anda ingin memiliki kontrol lebih besar atas tombol Anda.
Untuk tutorial tentang Buttons, baca Bootstrap Buttons Tutorial .
Button Plugin Kelas
Kelas bawah ini dapat digunakan untuk gaya apapun <a>, <button> , atau <input> elemen:
| Kelas | Deskripsi | Contoh |
|---|---|---|
| .btn | Menambahkan styling dasar untuk tombol apapun | Cobalah |
| .btn-default | Menunjukkan default / tombol standar | Cobalah |
| .btn-primary | Memberikan berat visual ekstra dan mengidentifikasi tindakan utama dalam satu set tombol | Cobalah |
| .btn-success | Menunjukkan tindakan berhasil atau positif | Cobalah |
| .btn-info | Tombol kontekstual untuk pesan peringatan informasi | Cobalah |
| .btn-warning | Menunjukkan hati-hati harus diambil dengan tindakan ini | Cobalah |
| .btn-danger | Menunjukkan tindakan yang berbahaya atau berpotensi negatif | Cobalah |
| .btn-link | Membuat tombol terlihat seperti link (masih akan memiliki perilaku tombol) | Cobalah |
| .btn-lg | Membuat tombol besar | Cobalah |
| .btn-sm | Membuat tombol kecil | Cobalah |
| .btn-xs | Membuat tombol kecil tambahan | Cobalah |
| .btn-block | Membuat tombol blok-tingkat (bentang lebar penuh dari elemen induk) | Cobalah |
| .active | Membuat tombol tampil menekan | Cobalah |
| .disabled | Membuat tombol dinonaktifkan | Cobalah |
via JavaScript
Aktifkan manual dengan:
$('.btn').button();
tombol Options
| None |
Metode tombol
Tabel berikut berisi metode tombol semua tersedia.
Catatan: Untuk plugin ini, metode dapat juga ditularkan melalui atribut data; menambahkan nama metode untuk data-, seperti data-ubah atau data-loading.
| metode | Deskripsi | Cobalah |
|---|---|---|
| .button("toggle") | Membuat tombol tampilan ditekan | Cobalah |
| .button("loading") | Menonaktifkan tombol dan mengubah teks tombol untuk "memuat ..." | Cobalah |
| .button("reset") | Mengubah tombol teks ke teks asli (jika berubah) | Cobalah |
| .button("string") | Menentukan tombol teks baru | Cobalah |
contoh
Menggunakan CSS Customize Buttons
Bagaimana menghapus perbatasan bulat:
Bagaimana menambahkan warna tertentu:
Contoh
.btn-default {
background: #000;
color: #fff;
}
.btn-default:hover {
background: #fff;
color: #000;
} Cobalah sendiri " Cara menambahkan bayangan: