For each website that I make a new CSS stylesheet for, I typically make a preview page that looks something like this:
<h2>This is an h2</h2>
<a href="#" class="external">This is an a.external</a>
Which creates output like this:
This is an h2This is an a.external
This make for a handy reference guide to all your styles, but can be a bit cumbersome to setup, especially if you have a big stylesheet.
Today I discovered an awesome feature of Textmate that automates this whole process. When editing your stylesheet in Textmate, use the Show Web Preview command ( ctrl + option + ⌘ + p ) to generate a list of all your different styles.
I discovered this via this post on tumblr.