JS Button (button.js)
Utilizați acest plugin dacă doriți să aveți mai mult control asupra butoane.
Pentru un tutorial despre butoane, citiți noastre Bootstrap Butoane Tutorial .
Clasele buton Plugin
Clasele de mai jos pot fi folosite pentru orice stil <a>, <button> sau <input> Element:
Clasă | Descriere | Exemplu |
---|---|---|
.btn | Adaugă un stil de bază pentru orice buton | Incearca-l |
.btn-default | Indică un buton implicit / Standard | Incearca-l |
.btn-primary | Oferă greutate vizuală în plus și identifică acțiunea principală într-un set de butoane | Incearca-l |
.btn-success | Indică o acțiune de succes sau pozitiv | Incearca-l |
.btn-info | Butonul contextuală pentru mesaje de alertă informaționale | Incearca-l |
.btn-warning | Indică faptul că precauție trebuie luate cu această acțiune | Incearca-l |
.btn-danger | Indică o acțiune periculoasă sau potențial negativ | Incearca-l |
.btn-link | Face un buton arata ca un link (will still have button behavior) în (will still have button behavior) un (will still have button behavior) | Incearca-l |
.btn-lg | Face un buton mare | Incearca-l |
.btn-sm | Face un mic buton | Incearca-l |
.btn-xs | Face un buton foarte mic | Incearca-l |
.btn-block | Face un buton de nivel bloc (spans the full width of the parent element) se (spans the full width of the parent element) pe (spans the full width of the parent element) | Incearca-l |
.active | Face butonul par apăsat | Incearca-l |
.disabled | Face butonul dezactivat | Incearca-l |
Via JavaScript
Activați manual cu:
$('.btn').button();
Opțiuni buton
Nici unul |
Metode Button
Tabelul de mai jos listează toate disponibile metode de buton.
Notă: Pentru acest plugin, metode pot fi , de asemenea , transmise prin atribute de date; adăugați numele metodei pentru a datelor, ca în date de comutare sau de date de încărcare.
Metodă | Descriere | Incearca-l |
---|---|---|
. button("toggle") | Face butonul aspectul apăsat | Incearca-l |
. button("loading") | Dezactivează butonul și modifică textul buton pentru "loading..." | Incearca-l |
. button("reset") | Schimbă textul buton pentru textul original (if changed) este (if changed) | Incearca-l |
. button("string") | Specifică un text nou buton | Incearca-l |
Exemple
Utilizarea CSS pentru a Particularizați butoane
Cum de a elimina frontierele rotunjite:
Cum se adaugă o anumită culoare:
Exemplu
.btn-default {
background: #000;
color: #fff;
}
.btn-default:hover {
background: #fff;
color: #000;
}
Încearcă - l singur » Cum se adaugă umbre: