Typography

Below is just about everything you’ll need to style in the theme. Check the source code to see the many embedded elements within paragraphs.


This is a Heading Element 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris metus tortor, commodo sit amet tempor id, gravida eget orci. In molestie feugiat nunc ac lobortis. Ut non nisi dolor, ac ultricies lorem. Vestibulum non lectus in arcu gravida malesuada. Curabitur sed sollicitudin mi. Aenean sit amet tortor ac arcu gravida rutrum eget ac dui.

This is a Heading Element 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris metus tortor, commodo sit amet tempor id, gravida eget orci. In molestie feugiat nunc ac lobortis. Ut non nisi dolor, ac ultricies lorem. Vestibulum non lectus in arcu gravida malesuada. Curabitur sed sollicitudin mi. Aenean sit amet tortor ac arcu gravida rutrum eget ac dui.

This is a Heading Element 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris metus tortor, commodo sit amet tempor id, gravida eget orci. In molestie feugiat nunc ac lobortis. Ut non nisi dolor, ac ultricies lorem. Vestibulum non lectus in arcu gravida malesuada. Curabitur sed sollicitudin mi. Aenean sit amet tortor ac arcu gravida rutrum eget ac dui.

This is a Heading Element 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris metus tortor, commodo sit amet tempor id, gravida eget orci. In molestie feugiat nunc ac lobortis. Ut non nisi dolor, ac ultricies lorem. Vestibulum non lectus in arcu gravida malesuada. Curabitur sed sollicitudin mi. Aenean sit amet tortor ac arcu gravida rutrum eget ac dui.

This is a Heading Element 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris metus tortor, commodo sit amet tempor id, gravida eget orci. In molestie feugiat nunc ac lobortis. Ut non nisi dolor, ac ultricies lorem. Vestibulum non lectus in arcu gravida malesuada. Curabitur sed sollicitudin mi. Aenean sit amet tortor ac arcu gravida rutrum eget ac dui.

This is a Heading Element 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris metus tortor, commodo sit amet tempor id, gravida eget orci. In molestie feugiat nunc ac lobortis. Ut non nisi dolor, ac ultricies lorem. Vestibulum non lectus in arcu gravida malesuada. Curabitur sed sollicitudin mi. Aenean sit amet tortor ac arcu gravida rutrum eget ac dui.


Lorem ipsum dolor sit amet, test link adipiscing elit. This is strong. Nullam dignissim convallis est. Quisque aliquam. This is emphasized. Donec faucibus. Nunc iaculis suscipit dui. 53 = 125. Water is H2O. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. The New York Times (That’s a citation). Underline. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus.

HTML and CSS are our tools. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. To copy a file type Dinner’s at 5:00. Let’s make that 7. This text has been struck.


List Types

Definition List

Definition List Title
This is a definition list division.
Definition
An exact statement or description of the nature, scope, or meaning of something: our definition of what constitutes poetry.

Ordered List

  1. List Item 1
  2. List Item 2
    1. Nested list item A
    2. Nested list item B
  3. List Item 3

Unordered List

  • List Item 1
  • List Item 2
    • Nested list item A
    • Nested list item B
  • List Item 3

Table

Table Header 1 Table Header 2 Table Header 3
Division 1 Division 2 Division 3
Division 1 Division 2 Division 3
Division 1 Division 2 Division 3

Preformatted Text

Typographically, preformatted text is not the same thing as code. Sometimes, a faithful execution of the text requires preformatted text that may not have anything to do with code. Most browsers use Courier and that’s a good default — with one slight adjustment, Courier 10 Pitch over regular Courier for Linux users. For example:

“Beware the Jabberwock, my son!
    The jaws that bite, the claws that catch!
Beware the Jubjub bird, and shun
    The frumious Bandersnatch!”

Blockquotes

Let’s keep it simple. Italics are good to help set it off from the body text (and italic Georgia is lovely at this size). Be sure to style the citation.

Good afternoon, gentlemen. I am a HAL 9000 computer. I became operational at the H.A.L. plant in Urbana, Illinois on the 12th of January 1992. My instructor was Mr. Langley, and he taught me to sing a song. If you’d like to hear it I can sing it for you.

HAL 9000

And here’s a bit of trailing text.

17 thoughts on “Typography

  1. s. Morbi suscipit libero a nisl. Sed quam ipsum, ullamcorper non, congue vitae, ornare non, nisl. Nunc ultrices. Aliquam imperdiet velit sit amet nulla. Sed a neque. Fusce tempus tortor ut diam. Quisque sagittis lacus eget velit. Quisque augue magna, commodo in, molestie nec, convallis at, tortor

  2. ulla, congue a, rhoncus nec, vestibulum a, ante. Mauris lobortis iaculis erat. Maecenas faucibus tincidunt dui. Cras accumsan vestibulum ligula. Morbi dapibus, lorem nec euismod pharetra, augue risus congue augue, molestie eleifend lacus magna nec magna. Morbi ac lorem.

    Aliquam id ipsum. Sed mauris. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin ac ipsum. Nunc vitae sapien sit amet tellus eleifend hendrerit. Phasellus orci nunc, fermentum eu, u

  3. abitur nibh. Vestibulum ut risus. Integer laoreet, ipsum congue congue suscipit, ipsum est molestie dolor, consectetur tempus justo lectus ac mauris.

    Integer vulputate molestie quam. Vestibulum et nisi. Nullam in magna quis libero posuere vestibulum. Donec mi leo, elementum ut, tincidunt at, condimentum eu, est. Donec sed nisl ac justo consectetur viverra. Nulla volutpat

  4. mi, fringilla tempor, varius sit amet, placerat a, velit. Suspendisse justo. In vehicula urna fringilla neque. Suspendisse cursus, magna a imperdiet pellentesque, lacus velit dignissim urna, vel suscipit massa enim ac nunc. Proin porta aliquet eros. Curabitur ut erat. Quisque vitae tortor.

    Duis imperdiet, mi eget euismod fermentum, odio nisl posuere quam, sit amet tristique urna diam at lacus. Duis congue lacus non ipsum. Donec felis tortor, lacinia at, rhoncus id, scelerisque ornare, nisi. Mauris felis ligula, pharetra vitae, posuere eget, tincidunt at, turpis. Donec eget ligula. Praesent fermentum dictum nisl. Phasellus enim. Nam placerat. Ut dignissim est nec lorem. Aliquam eros augue, rutrum et, placerat in, euismod in, libero. Morbi venenatis, eros non gravida rhoncus, leo metus venenatis augue, vitae dignissim lorem sapien eget diam. Ut nisl. Fusce quis lorem. Etiam mollis risus. Integer luctus. In quis quam. Pellentesque habitant morbi tristique senectus et

  5. que congue, lorem sed cursus ullamcorper, mauris urna adipiscing enim, eget pulvinar est lacus ut augue.

    Aliquam erat volutpat. Proin scelerisque lectus non purus. Donec quis tellus. Vestibulum dictum imperdiet lacus. Integer magna libero, feugiat id, tincidunt eu, venenatis vel, mi. Cras mi. Vestibulum est. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed ut magna quis felis congue commodo. Fusce dictum hendrerit dolor. Donec commodo euismod dolor. Curabitur nibh. Vestibulum ut risus. Integer laoreet, ipsum congue congue suscipit, ipsum est molestie dolor, consectetur tempus justo lectus ac ma

  6. nisi. Sed at mi. Donec eget odio in est tempus malesuada. Donec sem. Donec tortor. In auctor purus a lectus. Nulla a leo. Curabitur velit. In et lorem. Quisque congue, lorem sed cursus ullamcorper, mauris urna adipiscing enim, eget pulvinar est lacus ut augue.

    Aliquam erat volutpat. Proin scelerisque lectus non purus. Donec qui

  7. us. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent quam turpis, dignissim et, consequat in, porttitor eget, orci. Aenean pretium, orci vel ultrices dapibus, ipsum metus lobortis ante, ac tincidunt urna erat et tortor. Mauris nisl eros, dapibus et, tristique ege

  8. diet et, vulputate semper, dolor. Phasellus laoreet, sapien in molestie gravida, velit quam consequat enim, sit amet malesuada arcu justo vitae turpis. Aliquam orci lorem, ornare ut, congue nec, bibendum at, erat. Donec vitae nisl id risus euismod viverra. Pellentesque eleifend risus sit amet diam. Mauris pharetra ornare tellus. Pellentesque ante elit, vestibulum eget, laoreet dictum, pulvinar vitae, velit. Mauris vel augue quis enim ornare imperdiet.

  9. amet, consectetur adipiscing elit. Maecenas elit risus, pellentesque sed, imperdiet quis, pulvinar in, odio.

    Duis nulla diam, fringilla at, feugiat et, tincidunt consectetur, magna. Duis id est ac neque mollis ullamcorper. Nulla quis urna. Ut vitae nisi sit amet lectus blandit ultrices. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices p

  10. ie eros. Maecenas molestie pharetra augue. In sagittis enim vitae libero. Praesent feugiat blandit lacus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas erat lacus, sollicitudin placerat, facilisis nec, tempor nec, elit. Pellentesque iaculis urna ut leo mattis sagittis. Cras urna. Vestibulum malesuada orci eget leo.

    Etiam egestas auctor sapien. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent feugiat. Donec vehicula, dui nec adipiscing ultricies, lorem urna eleifend arcu, eu congue libero lectus ac lacus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent pulvinar pellentesque lacus. Suspendisse urna orci, rutrum a, placerat a, suscipit a, est. Aliquam ac odio. Fusce arcu lorem, sodales et, condimentum ultrices

  11. mcorper, erat sapien tempor dolor, ac consectetur diam ante at nibh. Proin erat lectus, vehicula id, consequat quis, semper ac, felis. Sed in lectus. Duis nec massa. Nullam augue. Duis dolor felis, porta et, molestie vitae, imperdiet eget, purus. Mauris iaculis. In cursus, neque eu sollicitudin ullamcorper, odio mauris tempus odio, id tincidunt metus leo vel ipsum. Quisque suscipit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nullam sed libero. Nunc sollicitudin diam ac dui. Nunc faucibus auctor tortor. Quisque ipsum sem, hendrerit accumsan, congue ut, porttitor ut, turpis. Sed sollicitudin, leo et condimentum tempus, massa augue dictum est, iaculis posuere nulla felis quis tortor. Pellentesque ac nisl vitae nunc porta pretium. Praesent id erat. Cras leo. Quisque eleifend metu

  12. dolor. Donec eleifend leo sit amet diam. Quisque ante. Aliquam erat volutpat.

    Maecenas vel lectus. Maecenas convallis lorem at risus. Nullam facilisis tortor. Quisque quis turpis. Suspendisse consectetur nisl. Integer facilisis, massa consectetur mattis sollicitudin, lectus elit pharetra eros, ut dignissim sapien nunc eu nisi. Nunc tortor. Vestibulum imperdiet. Aliquam erat volutpat. Integer fermentum tincidunt nisl. Vivamus fringilla, augu

  13. itudin elementum tellus. Suspendisse mauris enim, ultricies ut, rhoncus non, sodales at, arcu.

    Nam eu tortor. Nam venenatis congue nibh. Donec posuere lacinia neque. Pellentesque vehicula. Nam eleifend ipsum. Vestibulum lectus diam, viverra vitae, tempor sit amet, eleifend eu, quam. Aenean aliquam ornare tellus. Donec vel ligula ut mauris pellentesque mattis. In neque leo, porta non, rutrum vel, sollicitudin a, libero. Pellentesque ornare mauris id odio. Aliquam erat volutpat. Aenean eget ante eget nunc feugiat lacinia. Duis ullamcorper consequat risus. Nunc at magna.

    Aliquam in elit vitae dui gravida venenatis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aliquam bibendum risus id nunc. Nullam tempus molestie eros. Maecenas molestie pharetra augue. In sagittis enim vitae libero. Praesent feugiat blandit lacus. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

  14. ubilia Curae; Proin nisi. Nunc hendrerit nisi lobortis purus.

    Vivamus turpis ante, ultrices scelerisque, elementum id, tempor at, quam. Cras eu mauris eu nulla congue convallis. Fusce ornare, n

  15. Nunc hendrerit nisi lobortis purus.

    Vivamus turpis ante, ultrices scelerisque, elementum id, tempor at, quam. Cras eu mauris eu nulla congue convallis. Fusce ornare, nibh sit amet porta rhoncus, nibh metus tincidunt magna, quis gravida dui neque pharetra risus. Etiam a felis. Fusce sed dolor. Mauris lectus mi, fringilla tempor, varius sit amet, placerat a, velit. Suspendisse justo. In vehicula urna fringilla neque. Suspendisse cursus, magna a imperdiet pellentesque, lacus velit dignissim urna, vel suscipit massa enim ac nunc. Proin porta aliquet eros. Curabitur ut erat. Quisque vitae tortor.

    Duis

  16. cibus aliquet, egestas in, adipiscing sit amet, risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin nisi. Nunc hendrerit nisi lobortis purus.

    Vivamus turpis ante, ultrices scelerisque, elementum id, tempor at, quam. Cras eu mauris eu nulla congue convallis. Fusce ornare, nibh sit amet porta rhoncus, nibh metus tincidunt magna, quis gravida dui neque pharetra risus. Etiam a felis. Fusce sed dolor. Mauris lectus mi, fringilla tempor, varius sit amet, placerat a, velit. Suspendisse justo. In vehicula urna fringilla neque. Suspendisse cursus, magna a imperdiet pellentesque, lacus velit dignissim urna, vel suscipit massa enim ac nunc. Proin porta al

  17. idunt at, condimentum eu, est. Donec sed nisl ac justo consectetur viverra. Nulla volutpat est vitae nisl. Nullam aliquam ipsum a arcu facilisis adipiscing. Pellentesque cursus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla gravida viverra urna.

    Aenean condimentum, arcu sit amet volutpat ullamcorper, erat sapien tempor dolor, ac consectetur diam ante at nibh. Proin erat lectus, vehicula id, consequat quis, semper ac, felis. Sed in lectus. Duis nec massa. Nullam augue. Duis dolor felis, porta et, molestie vitae, imperdiet eget, purus. Mauris iaculis. In cursus, neque eu sollicitudin ullamcorper, odio mauris tempus odio, id tincidunt metus leo vel ipsum. Quisque suscipit. Class aptent taci

Leave a Reply

Your email address will not be published. Required fields are marked *