Button

Basic

Rounded

To create a rounded button, use the .btn-rounded class.

3D

To create a 3D button, use the .btn-3d class.

Outline

To create an outline button, use the .btn-outline class.

Colorless

Make an outline button colorless by adding the .btn-outline-colorless class.

Inverted

Make an outline button colorless and inverted by adding the .btn-outline-colorless-inverted class.

Block level

To create a block level button, use the .btn-block class.

Active state

Disabled

Make buttons look inactive by adding the disabled boolean attribute to any <button> element.

Active + disabled

Loading

To show a loading indicator, add the .btn-loading class to a .btn element.

Toggle states

Add data-toggle="button" to toggle a button’s active state. If you’re pre-toggling a button, you must manually add the .active class and aria-pressed="true" to the <button>.

Checkbox and radio

Button styles can be applied to other elements, such as <label>s, to provide checkbox or radio style button toggling.

Sizes

Usage

To use the bootstrap's button plugin, you need to require it:


require(['px-bootstrap/button']);
        

Usage

To use buttons, you need to include ui-bootstrap.js script:


<script src="path/to/js/ui-bootstrap.js"></script>
        

Example