Bootstrap is a free front-end framework for faster and easier web development
Bootstrap includes HTML and CSS based design templates for typography, forms, buttons, tables, navigation, modals, image carousels and many other, as well as optional JavaScript plugins
Bootstrap also gives you the
ability to easily create responsive designs
Extra small <576px |
Small ≥576px |
Medium ≥768px |
Large ≥992px |
Extra Large ≥1200px |
XXL ≥1400px |
|
---|---|---|---|---|---|---|
max-width | 100% | 540px | 720px | 960px | 1140px | 1320px |
span 1 | span 1 | span 1 | span 1 | span 1 | span 1 | span 1 | span 1 | span 1 | span 1 | span 1 | span 1 |
span 4 | span 4 | span 4 | |||||||||
span 4 | span 8 | ||||||||||
span 6 | span 6 | ||||||||||
span 12 |
elements have margin-top: 0 and margin-bottom: 1rem (16px by default).
Class | Description |
---|---|
.lead |
Makes a paragraph stand out |
.text-start |
Indicates left-aligned text |
.text-break |
Prevents long text from breaking layout |
.text-center |
Indicates center-aligned text |
.text-decoration-none |
Removes the underline from a link |
.text-end |
Indicates right-aligned text |
.text-nowrap |
Indicates no wrap text |
.text-lowercase |
Indicates lowercased text |
.text-uppercase |
Indicates uppercased text |
.text-capitalize |
Indicates capitalized text |
.initialism |
Displays the text inside an <abbr> element in a slightly smaller font size |
.list-unstyled |
Removes the default list-style and left margin on list items (works on both <ul> and <ol> ). This class only applies to immediate children
list items (to remove the default list-style from any nested lists, apply this class to any nested lists as well) |
.list-inline |
Places all list items on a single line (used together with
.list-inline-item on each <li> elements) |