PL flag PL flag

Typography

Primary tabs

h1. Heading 1

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.

h2. Heading 2

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.

h3. Heading 3

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.

h4. Heading 4

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.

h5. Heading 5

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.

h6. Heading 6

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.


Blockquotes

To include a blockquote, wrap <blockquote> around any HTML as the quote. For straight quotes we recommend a <p>.

Include an optional <small> element to cite your source and you'll get an em dash &mdash; before it for styling purposes.

  1. <blockquote>
  2. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante venenatis.</p>
  3. <small>Someone famous</small>
  4. </blockquote>


Default blockquotes are styled as such:

Lorem ipsum dolor sit amet, dicta aliquip ad vix, ne sit everti corpora. Qui cu eros feugiat, elitr iudico ad pri. Nam id neque est, sed luctus urna. Nunc dolor quam, dignissim ut pellentesque in, malesuada et orci. Nunc dignissim adipiscing semper.

Someone famous in Body of work


To float your blockquote to the right, add class="pull-right":

Lorem ipsum dolor sit amet, dicta aliquip ad vix, ne sit everti corpora. Qui cu eros feugiat, elitr iudico ad pri. Nam id neque est, sed luctus urna. Nunc dolor quam, dignissim ut pellentesque in, malesuada et orci. Nunc dignissim adipiscing semper.

Someone famous in Body of work


Lists

Your list
  • Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
  • Nullam quis risus eget urna mollis ornare vel eu leo.
  • Nullam id dolor id nibh ultricies vehicula ut id elit.
  • Donec id elit non mi porta gravida at eget metus.
Your list
  • Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
  • Nullam quis risus eget urna mollis ornare vel eu leo.
  • Nullam id dolor id nibh ultricies vehicula ut id elit.
  • Donec id elit non mi porta gravida at eget metus.


Containers

25 June 2013

Athletics program exceeding

Autem possim his cu, quodsi nominavi fabellas ut sit, mea ea ullum epicurei. Saepe tantas ocurreret duo ea, has facilisi vulputate an.

25 June 2013

Next workshop

Autem possim his cu, quodsi nominavi fabellas ut sit, mea ea ullum epicurei. Saepe tantas ocurreret duo ea, has facilisi vulputate an.

Read more


Tables

1. Default table styles

Tables are automatically styled with only a few borders to ensure readability and maintain structure. With 2.0, the .table class is required.

  1. <table class="table">
  2. </table>
# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter


2. Striped table

Get a little fancy with your tables by adding zebra-striping—just add the .table-striped class.

Note: Striped tables use the :nth-child CSS selector and is not available in IE7-IE8.

  1. <table class="table table-striped">
  2. </table>
# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter


3. Bordered table

Add borders around the entire table and rounded corners for aesthetic purposes.

  1. <table class="table table-bordered">
  2. </table>
# First Name Last Name Username
1 Mark Otto @mdo
Mark Otto @TwBootstrap
2 Jacob Thornton @fat
3 Larry the Bird @twitter


4. Condensed table

Make your tables more compact by adding the .table-condensed class to cut table cell padding in half (from 8px to 4px).

  1. <table class="table table-condensed">
  2. </table>
# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter


5. Combine them all!

Feel free to combine any of the table classes to achieve different looks by utilizing any of the available classes.

  1. <table class="table table-striped table-bordered table-condensed">
  2. ...
  3. </table>
# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter


5. More style

Feel free to combine any of the table classes to achieve different looks by utilizing any of the available classes.

  1. <table class="table table-striped table-bordered table-condensed">
  2. ...
  3. </table>
Lesson Instructor Time Room
Curabitur blandit tempus porttitor Mark Twain 10.30 AM 004
Pellentesque ornare sem Janet Hope 10.30 AM 014
Integer posuere erat a ante venenatis Tom Cruise 12.30 AM 094
Sed posuere consectetur Bob Sinclair 11.30 AM 054

Font Awesome

361 icons provided by Font Awesome.

Back to Top