</div>
<div class="span3">
<p>Or, use them in navigation.</p>
- <div class="well" style="padding: 8px 0;">
- <ul class="nav list">
- <li class="nav-header">List header</li>
- <li class="active"><a href="#"><i class="home"></i> Home</a></li>
- <li><a href="#"><i class="download"></i> Downloads</a></li>
- <li><a href="#"><i class="film"></i> Movies</a></li>
+ <div class="well side-nav">
+ <ul class="nav-group">
+ <li class="active"><a class="nav-item" href="#"><i class="home"></i> Home</a></li>
+ <li><a class="nav-item" href="#"><i class="book"></i> Library</a></li>
+ <li><a class="nav-item" href="#"><i class="cog"></i> Settings</a></li>
</ul>
</div>
</div>
</pre>
</div>
</div>
- <div class="row">
- <div class="span4">
- <h3>Sidebar navigation with icon</h3>
- <div class="well" style="padding: 8px 0;">
- <ul class="nav list">
- <li class="nav-header">List header</li>
- <li class="active"><a href="#"><i class="home"></i> Home</a></li>
- <li><a href="#"><i class="download"></i> Downloads</a></li>
- <li><a href="#"><i class="film"></i> Movies</a></li>
- <li><a href="#"><i class="picture"></i> Picture</a></li>
- <li class="nav-header">Another list header</li>
- <li><a href="#"><i class="user"></i> Profile</a></li>
- <li><a href="#"><i class="asterisk"></i> Settings</a></li>
- </ul>
- </div> <!-- /well -->
- </div>
- <div class="span8">
- <h3>Simple markup</h3>
-<pre class="prettyprint linenums">
-<ul class="nav list">
- <li class="nav-header">List header</li>
- <li class="active"><a href="#"><i class="home"></i> Home</a></li>
- <li><a href="#"><i class="download"></i> Downloads</a></li>
- <li><a href="#"><i class="film"></i> Movies</a></li>
- ...
-</ul>
-</pre>
- </div>
- </div>
+
<h2>Tabbable nav <small>Bring tabs to life via javascript</small></h2>
<div class="row">