This is some text
This is some text
The small element is used to create a lighter, secondary text in any heading:
Use the mark element to highlight text.
The WHO was founded in 1948.
For 50 years, WWF has been protecting the future of nature. The world's leading conservation organization, WWF works in 100 countries and is supported by 1.2 million members in the United States and close to 5 million globally.
For 50 years, WWF has been protecting the future of nature. The world's leading conservation organization, WWF works in 100 countries and is supported by 1.2 million members in the United States and close to 5 million globally.
Class - lead - czcionka wyróżniająca się ponad inne
The dl element indicates a description list:
Inline snippets of code should be embedded in the code element:
The following HTML elements: span
, section
, and div
defines a section in a document.
To indicate input that is typically entered via the keyboard, use the kbd element:
Use ctrl + p to open the Print dialog box.
For multiple lines of code, use the pre element:
Text in a pre element is displayed in a fixed-width font, and it preserves both spaces and line breaks.
Use the contextual classes to provide "meaning through colors":
This text is muted.
This text is important.
This text indicates success.
This text represents some information.
This text represents a warning.
This text represents danger.
Use the contextual background classes to provide "meaning through colors":
This text is important.
This text indicates success.
This text represents some information.
This text represents a warning.
This text represents danger.
Firstname | Lastname | |
---|---|---|
John | Doe | john@example.com |
Mary | Moe | mary@example.com |
Firstname | Lastname | |
---|---|---|
John | Doe | john@example.com |
Mary | Moe | mary@example.com |
July | Dooley | july@example.com |
John | Doe | john@example.com |
Mary | Moe | mary@example.com |
July | Dooley | july@example.com |
Bootstrap is the most popular HTML, CSS, and JS framework for ...
This is some text.
This is another text.
The .fade and .in classes adds a fading effect, when closing the alert message.
Envelope icon:
Search icon:
Search icon on a button:
Search icon on a styled button:
Print icon:
Print icon on a styled link button: Print
The panel-group class clears the bottom-margin.
Note: The data-parent attribute makes sure that all collapsible elements under the specified parent will be closed when one of the collapsible item is shown.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
An inverted navbar is black instead of gray.
This example adds a dropdown menu for the "Page 1" button in the navigation bar.
The .navbar-right class is used to right-align navigation bar buttons.
Make the viewport larger than 768px wide to see that all of the form elements are inline, left aligned, and the labels are alongside.
The form below shows input elements with different heights using .input-lg and .input-sm:
You can quickly size labels and form controls within a Horizontal form by adding .form-group-lg or .form-group-sm to the div class="form-group" element:
The form below shows input elements with different widths using different .col-xs-* classes:
Use the .help-block class to add a block level help text in forms:
Media Objects - align media objects (like images or videoes) to the left or to the right of some content
The media object can also be top, middle or bottom-aligned with the "media-top", "media-middle" or "media-bottom" class:
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.