"Main Layout"
Bootstrap 3.1.0 Snippet by abhikhandelwal

Post to Facebook Tweet this

<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="description" content=""> <meta name="author" content=""> <link rel="shortcut icon" href="../../assets/ico/favicon.ico"> <title>Fixed Top Navbar Example for Bootstrap</title> <!-- Bootstrap core CSS --> <link href="../../dist/css/bootstrap.min.css" rel="stylesheet"> <!-- Custom styles for this template --> <link href="navbar-fixed-top.css" rel="stylesheet"> <!-- Just for debugging purposes. Don't actually copy this line! --> <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]--> <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries --> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> <![endif]--> </head> <body> <!-- Fixed navbar --> <div class="navbar navbar-default navbar-fixed-top" role="navigation"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="#">Letter Mark</a> </div> <div class="navbar-collapse collapse"> <ul class="nav navbar-nav"> <li class="active"><a href="#">Home</a></li> <li><a href="#about">About LetterMark</a></li> <li><a href="#about">Products/Business models</a></li> <li><a href="#contact">Contact</a></li> <!--<li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">Users <b class="caret"></b></a> <ul class="dropdown-menu"> <li><a href="#">Sign in</a></li> <li><a href="#">Register</a></li> </ul> </li>--> </ul> <ul class="nav navbar-nav navbar-right"> <li><a href="#">Sign in</a></li> <li><a href="#">Register</a></li> </ul> </div><!--/.nav-collapse --> </div> </div> <div class="container"> <!-- Main component for a primary marketing message or call to action --> <div class="jumbotron"> <h1>Navbar example</h1> <p>This example is a quick exercise to illustrate how the default, static and fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts to your viewport and device.</p> <p>To see the difference between static and fixed top navbars, just scroll.</p> <p> <a class="btn btn-lg btn-primary" href="../../components/#navbar" role="button">View navbar docs »</a> </p> </div> </div> <!-- /container --> <!-- Bootstrap core JavaScript ================================================== --> <!-- Placed at the end of the document so the pages load faster --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="../../dist/js/bootstrap.min.js"></script> </body> </html>

Questions / Comments: