Bootstrap Buttons
Bootstrap Buttons allow you to quickly style and customize buttons using predefined classes.
🎨 Basic Button Classes
Use the btn class followed by a style class:
| Class | Style |
|---|---|
btn-default | Default button |
btn-primary | Primary action (Blue) |
btn-success | Success message (Green) |
btn-info | Informational (Light blue) |
btn-warning | Warning (Yellow) |
btn-danger | Danger or delete action (Red) |
btn-link | Looks like a hyperlink |
Example:
📏 Button Sizes
| Class | Size |
|---|---|
btn-lg | Large |
btn-md | Medium (default) |
btn-sm | Small |
btn-xs | Extra small |
🧱 Block-Level Button (Full Width)
Used for mobile responsiveness or form layouts.
🔁 Active & Disabled Buttons
Active:
Disabled:
🧩 Button as <a>, <button>, or <input>
🎯 Button Groups
You can group buttons to create segmented controls:
➕ Button Toolbar
✔ Summary
| Feature | Available |
|---|---|
| Basic styling | ✔️ |
| Sizes | ✔️ |
| Block level | ✔️ |
| Active/Disabled states | ✔️ |
| Button groups and toolbars | ✔️ |
