Typography
The elements below are HTML elements that will be styled a little bit differently by Bootstrap than browser defaults. Look at the "Try it" examples to see the result/differences.The classes below is used to style the elements further.
Code
| Element/Class | Description | Example | <h1> - <h6> or .h1 - .h6 | h1 - h6 headings | <small> | Creates a lighter, secondary text in any heading Heading (secondary text) | .small | Indicates smaller text (set to 85% of the size of the parent): Smaller text | .lead | Makes a text stand out: Stand out text | <mark> or .mark | Highlights text: Highlighted text | <del> | Indicates deleted text: | <s> | Indicates no longer relevant text: | <ins> | Indicates inserted text: Inserted text | <u> | Indicates underlined text: Underlined text | <strong> | Indicates bold text: Bold text | <em> | Indicates italic text: Italic text | .text-left | Indicates left-aligned text | .text-center | Indicates center-aligned text | .text-right | Indicates right-aligned text | .text-justify | Indicates justified text | .text-nowrap | Indicates no wrap text | .text-lowercase | Indicates lowercased text: LOWERCASED TEXT | .text-uppercase | Indicates uppercased text: uppercased text | .text-capitalize | Indicates capitalized text: capitalized text | <abbr> | The <abbr> element indicates an abbreviation or acronym. Abbreviations with a title attribute have a dotted bottom border and a help cursor on hover, providing additional context on hover. | .initialism | Displays the text inside the <abbr> element in a slightly smaller font size | <address> | Presents contact information | <blockquote> | Indicates blocks of content from another source | .blockquote-reverse | Indicates a blockquote with right-aligned content | <ul> | Indicates an unordered list | <ol> | Indicates an ordered list | .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 | <dl> | Indicates a description list | .dl-horizontal | Lines up the terms and descriptions in the <dl> element side-by-side. Starts off like default <dl>s, but when the browser window expands, it will line up side-by-side | Element/Class | Description | Example | <var> | Indicates variables: x = ab + y | <kbd> | Indicates input that is typically entered via the keyboard: CTRL + P | <pre> | Indicates multiple lines of code | <pre class="pre-scrollable"> | Indicates multiple lines of code with scrollbar | <samp> | Indicates sample output from a computer program: Sample output | <code> | Indicates inline snippets of code: span, div |
|---|
Comments
Post a Comment