Bootstrap 4 JS-knoppie


Knoppie CSS-klasse

Vir 'n tutoriaal oor Knoppies, lees ons Bootstrap Buttons Tutoriaal .

Die klasse hieronder kan gebruik word om enige <a>-, <button>- of <input>-element te styl:

Class Description Example
.btn Adds basic styling to any button
.btn-block Makes a block-level button (spans the full width of the parent element)
.btn-danger Indicates a dangerous or potentially negative action
.btn-dark Dark grey button
.btn-default Indicates a default/standard button
.btn-info Contextual button for informational alert messages
.btn-lg Makes a large button
.btn-light Light grey button
.btn-link Makes a button look like a link (will still have button behavior)
.btn-outline-* Creates an outlined/bordered button. Use any of the contextual classes as * (btn-outline-primary, btn-outline-success, etc)
.btn-primary Provides extra visual weight and identifies the primary action in a set of buttons
.btn-sm Makes a small button
.btn-success Indicates a successful or positive action
.btn-secondary Indicates a "less" important action
.btn-toolbar Combine sets of button groups into button toolbars for more complex components
.btn-warning Indicates caution should be taken with this action
.active Makes the button appear pressed
.disabled Makes the button disabled

Via JavaScript

Aktiveer handmatig met:

$('.btn').button();

Knoppie-opsies

None

Knoppie Metodes

Die volgende tabel lys alle beskikbare knoppiemetodes.

Let wel: Metodes kan ook deur data-kenmerke deurgegee word; voeg die metodenaam by data-, soos in data-wissel of data-dispose.

Method Description Try it
.button("toggle") Makes the button look pressed
.button("dispose") Destroys an element's button