## Primary Nav

### HTML

                        <nav id="nav" class="nav">
    	<ul>
    		<li><a href="&#x2F;patterns&#x2F;04-pages-00-homepage&#x2F;04-pages-00-homepage.html">Home</a></li>
    		<li><a href="#">About</a></li>
    		<li><a href="&#x2F;patterns&#x2F;04-pages-01-blog&#x2F;04-pages-01-blog.html">Blog</a></li>
    		<li><a href="#">Contact</a></li>
    	</ul>
    </nav><!--end .nav-->

## Footer Nav

### HTML

                        <ul class="nav-footer">
    	<li><a href="&#x2F;patterns&#x2F;04-pages-00-homepage&#x2F;04-pages-00-homepage.html">Home</a></li>
    	<li><a href="#">About</a></li>
    	<li><a href="&#x2F;patterns&#x2F;04-pages-01-blog&#x2F;04-pages-01-blog.html">Blog</a></li>
    	<li><a href="#">Contact</a></li>
    </ul>

## Breadcrumbs

### HTML

                        <ul class="breadcrumbs">
    	<li><a href="#">Grandparent</a></li>
    	<li><a href="#">Parent</a></li>
    	<li><a href="#">Child</a></li>
    	<li><a href="#">Grandchild</a></li>
    	<li><a href="#">Great-Grandchild</a></li>
    </ul>

## Pagination

1. 1
2. 2
3. 3
4. 4
5. 5
6. 6
7. 7

### HTML

                        <ol class="pagination">
    	<li class="current"><a href="#">1</a></li>
    	<li><a href="#">2</a></li>
    	<li><a href="#">3</a></li>
    	<li><a href="#">4</a></li>
    	<li><a href="#">5</a></li>
    	<li><a href="#">6</a></li>
    	<li><a href="#">7</a></li>
    </ol>

## Tabs

- Tab 1
- Tab 2
- Tab 3

### HTML

                        <div class="tabs">
    	<ul class="tab-list">
    		<li><a href="#" class="active">Tab 1</a></li>
    		<li><a href="#">Tab 2</a></li>
    		<li><a href="#">Tab 3</a></li>
    	</ul>
    </div>