Buttons
Use the btn class on <button> or <input type="button"> elements.
|
|
<input type="button" class="btn" value="Button"/>
|
|---|---|
|
|
<button class="btn">Button</button>
|
Small buttons
Add the btn-small class to other button classes to obtain a smaller affordance.
|
|
<input type="button" class="btn btn-small" value="Button"/>
|
|---|---|
|
|
<button class="btn btn-small">Button</button>
|
Large buttons
Add the btn-large class to other button classes to obtain a larger affordance.
|
|
<input type="button" class="btn btn-large" value="Button"/>
|
|---|---|
|
|
<button class="btn btn-large">Button</button>
|
Huge buttons
Add the btn-huge class to other button classes to obtain an even larger affordance.
|
|
<input type="button" class="btn btn-huge" value="Button"/>
|
|---|---|
|
|
<button class="btn btn-huge">Button</button>
|
Colorful buttons
Add the accent, danger, warning, info, or success classes to a button
to give the button a special semantic cue.
|
|
<button class="btn accent">Button</button>
|
|---|---|
|
|
<button class="btn danger">Button</button>
|
|
|
<button class="btn warning">Button</button>
|
|
|
<button class="btn info">Button</button>
|
|
|
<button class="btn success">Button</button>
|