<!DOCTYPE html> <html> <head> <title>Twitter Bootstrap Example</title> <link href="bootstrap/css/bootstrap.css" rel="stylesheet" media="screen"> </head> <body> <!-- The main container. --> <div class="container"> <!-- A menu bar. --> <div class="navbar"> <div class="navbar-inner"> <a class="brand" href="#">Twitter Bootstrap Example</a> <ul class="nav"> <li><a href="Default.cshtml">Home</a></li> <li class="active"><a href="About.cshtml">About</a></li> <li><a href="Contact.cshtml">Contact</a></li> </ul> </div> </div> <h1>About Bootstrap</h1> <h3>Tabs</h3> <p>Here's an example of the tabs.</p> <!-- The tab headings. --> <ul class="nav nav-tabs"> <li class="active"><a href="#homer" data-toggle="tab">Homer</a></li> <li><a href="#marge" data-toggle="tab">Marge</a></li> <li><a href="#grandpa" data-toggle="tab">Grandpa</a></li> </ul> <!-- The tab content. --> <div id="my-tab-content" class="tab-content"> <div class="tab-pane active" id="homer"> <p>Homer Simpson</p> </div> <div class="tab-pane" id="marge"> <p>Marge Simpson</p> </div> <div class="tab-pane" id="grandpa"> <p>Grandpa Simpson</p> </div> </div> <hr /> <h3>Pagination</h3> <div class="pagination"> <ul> <li><a href="#">Prev</a></li> <li><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="#">Next</a></li> </ul> </div> <!-- Include jQuery and Boostrap. --> <script src="http://code.jquery.com/jquery-latest.js"></script> <script src="bootstrap/js/bootstrap.min.js"></script> </div> </body> </html>
By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.
If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.
This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)
Submit an article or tip