You need to add the nav-list class in addition to the nav class that will make it look like a list. And adding class nav-header to any element of the nav class will make it look like a heading to the section of links. The HTML File looks as in the following,
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
- <html>
-
- <head>
- <title></title>
- <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
- <link href="Bootstrap/css/bootstrap.css" rel="stylesheet" type="text/css" />
- <script src="Bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
- </head>
-
- <body>
- <ul class="navnav-list">
- <li class="nav-header">Category</li>
- <li><a href="#">.NET</a></li>
- <li><a href="#">ASP.NET</a></li>
- <li><a href="#">Silverlight</a></li>
- <li><a href="#">WCF</a></li>
- <li class="nav-header">Database</li>
- <li><a href="#">SQL Server</a></li>
- <li><a href="#">Oracle</a></li>
- <li><a href="#">MySQL</a></li>
- </ul>
- </body>
-
- </html>
Now see how the list is rendering.