Lists

The list is a common way to display items well... in a list. By default they don't look very appealing, however below are some styles to spruce them up a little.

Examples

Default Unordered List

This is your basic unordered list. Nothing special except the style looks a little nicer.

  • Feed The Cat
  • Become Nice Genius
  • Help The World
Default Default Unordered List
<ul>
    <li>Feed The Cat</li>
    <li>Become Nice Genius</li>
    <li>Help The World</li>
</ul>

Default Ordered List

This is your basic ordered list. Nothing special again except the style looks a little nicer.

  1. Feed The Dog
  2. Become Evil Genius
  3. Take Over The World
Default Default Ordered List
<ol>
    <li>Feed The Dog</li>
    <li>Become Evil Genius</li>
    <li>Take Over The World</li>
</ol>

Collection List

You can apply the collection class to your lists to make them look a little nicer. This works with either the unordered list OR the ordered list.

  • Feed The Cat
  • Become Nice Genius
  • Help The World
Default Collection List
<ul class="collection">
    <li>Feed The Cat</li>
    <li>Become Nice Genius</li>
    <li>Help The World</li>
</ul>