Add meaning through text-colors with the classes below. Links will darken on hover:
| Class | Description | Example |
|---|---|---|
| .text-muted | Text styled with class "text-muted" | Try it |
| .text-primary | Text styled with class "text-primary" | Try it |
| .text-success | Text styled with class "text-success" | Try it |
| .text-info | Text styled with class "text-info" | Try it |
| .text-warning | Text styled with class "text-warning" | Try it |
| .text-danger | Text styled with class "text-danger" | Try it |
Add meaning through background-colors with the classes below. Links will darken on hover just like text classes:
| Class | Description | Example |
|---|---|---|
| .bg-primary | Table cell is styled with class "bg-primary" | Try it |
| .bg-success | Table cell is styled with class "bg-success" | Try it |
| .bg-info | Table cell is styled with class "bg-info" | Try it |
| .bg-warning | Table cell is styled with class "bg-warning" | Try it |
| .bg-danger | Table cell is styled with class "bg-danger" | Try it |
| Class | Description | Example |
|---|---|---|
| .pull-left | Floats an element to the left | Try it |
| .pull-right | Floats an element to the right | Try it |
| .center-block | Sets an element to display:block and center | Try it |
| .clearfix | Clears floats | |
| .show | Forces an element to be shown | Try it |
| .hidden | Forces an element to be hidden | Try it |
| .sr-only | Hides an element to all devices except screen readers | Try it |
| .sr-only-focusable | Combine with .sr-only to show the element again when it is focused (e.g. by a keyboard-only user) | Try it |
| .text-hide | Helps replace an element's text content with a background image | Try it |
| .close | Indicates a close icon | Try it |
| .caret | Indicates dropdown functionality (will reverse automatically in dropup menus) | Try it |
Your message has been sent to W3Schools.