Jumbotron! (and then some)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam suscipit sed risus non aliquam. Aenean interdum, tellus eget consectetur sodales, sapien neque faucibus nunc, in ullamcorper enim ex sit amet enim. Integer molestie et ante a blandit. Donec rhoncus ultrices neque vel pulvinar. Donec lacus nulla, pharetra eget pulvinar eu, lobortis quis mi. Fusce ultricies nibh felis, at eleifend quam porta a. Integer suscipit laoreet condimentum.

Heading 1 subheading

Paragraph lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam suscipit sed risus non aliquam. Aenean interdum, tellus eget consectetur sodales, sapien neque faucibus nunc, in ullamcorper enim ex sit amet enim.

Heading 2 subheading

Paragraph lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam suscipit sed risus non aliquam. Aenean interdum, tellus eget consectetur sodales, sapien neque faucibus nunc, in ullamcorper enim ex sit amet enim.

Heading 3 subheading

Paragraph lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam suscipit sed risus non aliquam. Aenean interdum, tellus eget consectetur sodales, sapien neque faucibus nunc, in ullamcorper enim ex sit amet enim.

Heading 4 subheading

Paragraph lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam suscipit sed risus non aliquam. Aenean interdum, tellus eget consectetur sodales, sapien neque faucibus nunc, in ullamcorper enim ex sit amet enim.

Heading 5 subheading

Paragraph lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam suscipit sed risus non aliquam. Aenean interdum, tellus eget consectetur sodales, sapien neque faucibus nunc, in ullamcorper enim ex sit amet enim.

Heading 6 subheading

Paragraph lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam suscipit sed risus non aliquam. Aenean interdum, tellus eget consectetur sodales, sapien neque faucibus nunc, in ullamcorper enim ex sit amet enim.

Unordered list

Paragraph lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam suscipit sed risus non aliquam. Aenean interdum, tellus eget consectetur sodales, sapien neque faucibus nunc, in ullamcorper enim ex sit amet enim.

  • Felis ut ultricies lacinia.
  • Mauris nec eros at ex luctus.
  • Suspendisse fringilla.
  • Lacinia porta vel eget erat.

Ordered list

Paragraph lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam suscipit sed risus non aliquam. Aenean interdum, tellus eget consectetur sodales, sapien neque faucibus nunc, in ullamcorper enim ex sit amet enim.

  1. Felis ut ultricies lacinia.
  2. Mauris nec eros at ex luctus.
  3. Suspendisse fringilla.
  4. Lacinia porta vel eget erat.

Blockquote

Paragraph lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam suscipit sed risus non aliquam. Aenean interdum, tellus eget consectetur sodales, sapien neque faucibus nunc, in ullamcorper enim ex sit amet enim.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Someone famous in Source Title

3 columns

Lorem ipsum dolor sit amet, consectetur adipiscing elit. This text is bold and this is strong. This text is italic and this is emphasized. Nunc laoreet nisl eget metus elementum egestas. Duis vulputate, risus quis tristique luctus, dolor sem sodales massa, vel porttitor diam mauris vel justo. In hac habitasse platea dictumst. Nullam lorem justo, pellentesque eu pellentesque a, aliquet vel sem. Read more

Lorem ipsum dolor sit amet, consectetur adipiscing elit. This text is bold and this is strong. This text is italic and this is emphasized. Nunc laoreet nisl eget metus elementum egestas. Duis vulputate, risus quis tristique luctus, dolor sem sodales massa, vel porttitor diam mauris vel justo. In hac habitasse platea dictumst. Nullam lorem justo, pellentesque eu pellentesque a, aliquet vel sem. Read more

Lorem ipsum dolor sit amet, consectetur adipiscing elit. This text is bold and this is strong. This text is italic and this is emphasized. Nunc laoreet nisl eget metus elementum egestas. Duis vulputate, risus quis tristique luctus, dolor sem sodales massa, vel porttitor diam mauris vel justo. In hac habitasse platea dictumst. Nullam lorem justo, pellentesque eu pellentesque a, aliquet vel sem. Read more

4 columns with linked headings

Column 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. This text is bold and this is strong. This text is italic and this is emphasized. Read more

Column 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. This text is bold and this is strong. This text is italic and this is emphasized. Read more

Column 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. This text is bold and this is strong. This text is italic and this is emphasized. Read more

Column 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. This text is bold and this is strong. This text is italic and this is emphasized. Read more

Table

Create responsive tables by wrapping any .table in .table-responsive to make them scroll horizontally on small devices (under 768px). When viewing on anything larger than 768px wide, you will not see any difference in these tables.

# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter

Definition list

This definition list has a class of .dl-horizontal; starts up stacked like normal definition lists, but expands when the navbar does. Try resizing this window to see it in action.

Ale
Top-fermented beer. The best beers in the world fall in this category.
Lager
Bottom-fermented beer. The most wide-spread beers in the world fall in this category.
The Local Pub
The best place in Athens, Greece, to enjoy tasty beer from Greece and all over the craft beer world.

Form

This is a typical form. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam suscipit sed risus non aliquam. Aenean interdum, tellus eget consectetur sodales, sapien neque faucibus nunc, in ullamcorper enim ex sit amet enim.

Example block-level help text here.

Horizontal form

Use Bootstrap's predefined grid classes to align labels and groups of form controls in a horizontal layout by adding .form-horizontal to the form (which doesn't have to be a <form>). Doing so changes .form-groups to behave as grid rows, so no need for .row.

Inline form

This is an inline form. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam suscipit sed risus non aliquam. Aenean interdum, tellus eget consectetur sodales, sapien neque faucibus nunc, in ullamcorper enim ex sit amet enim.

€
.00

More forms at getboostrap.com.