Whenever I shop for a new theme, I look at this page of paragraph styles first to see how elements are formatted.
h1 Heading
Quisque egestas erat sit amet tellus lacinia eu posuere eros. Ut orci diam, tempus et pharetra id, facilisis eleifend ipsum. Vivamus et feugiat leo.
h2 Heading
Ut orci diam, tempus et pharetra id, facilisis eleifend ipsum. Vivamus et feugiat leo. Pellentesque massa enim, dictum eget adipiscing ut, egestas nec libero.
h3 Heading
Quisque egestas erat sit amet tellus lacinia eu posuere eros accumsan. Ut orci diam, tempus et pharetra id, facilisis eleifend ipsum. Pellentesque massa enim, dictum eget adipiscing ut, egestas nec libero.
h4 Heading
Ut orci diam, tempus et pharetra id, facilisis eleifend ipsum. Vivamus et feugiat leo. Pellentesque massa enim, dictum eget adipiscing ut, egestas nec libero.
h5 Heading
Quisque egestas erat sit amet tellus lacinia eu posuere eros accumsan. Ut orci diam, tempus et pharetra id, facilisis eleifend ipsum. Vivamus et feugiat leo.
h6 Heading
Quisque egestas erat sit amet tellus lacinia eu posuere eros accumsan. Ut orci diam, tempus et pharetra id, facilisis eleifend ipsum. Pellentesque massa enim, dictum eget adipiscing ut, egestas nec libero.
Code
Here’s content formatted with code tags:
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
Pre
Here’s content formatted with pre tags:
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
Lists
Standard typography pages hardly ever show list items that go beyond a single line, nested list items, or double-digit step numbering.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- Integer dui mauris, sagittis sit amet eros id, dictum auctor nibh. Duis consectetur facilisis erat, sed egestas augue.
- Morbi tristique nec odio non mollis.
- Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin porta, velit non egestas pharetra, sapien mi fringilla massa, consectetur semper lorem nulla sed est.
- Donec turpis risus, tristique ut nibh id, feugiat consequat est.
- Aliquam sit amet tortor in elit pulvinar faucibus.
- Morbi lectus erat, tincidunt nec est vel, luctus tincidunt massa.
- Sed laoreet cursus arcu ac placerat.
- Fusce lacinia, est a pellentesque tempus, sem diam varius neque, ut luctus leo diam et nisl.
- Here’s a nested list:
- Mauris ultricies non sapien quis euismod. Cras sit amet imperdiet sapien, id facilisis nisi.
- Donec suscipit consequat eleifend.
- Donec id turpis malesuada, vehicula mi et, imperdiet risus. In in dignissim massa. Nunc eget erat est.
A paragraph preceding a list. Ut convallis aliquam ligula in elementum. In ut nulla at justo commodo laoreet ac ac ex.
- Morbi tristique nec odio non mollis.
- Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin porta, velit non egestas pharetra, sapien mi fringilla massa, consectetur semper lorem nulla sed est.
- Donec turpis risus, tristique ut nibh id, feugiat consequat est.
A paragraph following a list. Suspendisse mollis augue nisl, in faucibus justo pharetra ut. Nulla ultricies sodales nulla a tincidunt.
A heading preceding a list
- Morbi tristique nec odio non mollis.
- Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin porta, velit non egestas pharetra, sapien mi fringilla massa, consectetur semper lorem nulla sed est.
- Donec turpis risus, tristique ut nibh id, feugiat consequat est.
A heading following a list
Quotes
<blockquote>Blockquote</blockquote>
In ut nulla at justo commodo laoreet ac ac ex. Ut convallis aliquam ligula in elementum.
This is a blockquote. Nunc at justo justo. Mauris enim massa, euismod sed rutrum ac, dictum eu augue.
Nulla auctor ullamcorper molestie. Nam a leo eget augue tincidunt porttitor sit amet nec diam. Phasellus vel velit dictum metus sollicitudin elementum. Morbi eget magna velit, a sollicitudin est.
<span class="pullquote-left">Pull quote left</span>
Suspendisse potenti. Ut commodo leo purus, eu dignissim dui porttitor eget. Vestibulum purus felis, laoreet in felis ac, euismod viverra risus.Ut convallis aliquam ligula in elementum.Cras lobortis, libero quis egestas maximus, tortor nunc blandit tellus, ut finibus erat nunc lacinia ex. Pellentesque mollis odio ac eros sagittis ultricies. Aenean ac diam imperdiet, varius libero a, blandit felis. Cras hendrerit orci justo.
<span class="pullquote-right">Pull quote right</span>
Donec non mollis ante. Phasellus commodo eu velit quis efficitur. Maecenas tempus neque eu dictum imperdiet.Sed gravida lacus quis semper consectetur.Aenean lorem eros, consectetur sed fringilla sagittis, molestie ac ante. Mauris dictum odio auctor felis imperdiet, sit amet condimentum velit eleifend. Quisque semper justo nec massa iaculis cursus. Phasellus nunc eros, ultrices nec ullamcorper sed, ullamcorper eu lacus.
Dropcap
<span class="dropcap">F</span>
Fusce urna tortor, auctor facilisis quam ac, pellentesque suscipit nibh. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sed sodales neque, in viverra arcu. In vehicula enim velit, eu pretium magna ullamcorper id. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris at magna vehicula, eleifend dui vel, consequat augue.
tanster.com 