Difference between revisions of "Template:Team:Harvard BioDesign/Templates:header"

 
(20 intermediate revisions by 2 users not shown)
Line 1: Line 1:
<html>
+
<html lang="en">
 +
<head>
 +
  <title>Bootstrap Collapsable Header</title>
 +
  <meta charset="utf-8">
 +
  <meta name="viewport" content="width=device-width, initial-scale=1">
 +
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
 +
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
 +
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
 +
</head>
 +
<body>
  
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">  
+
<nav class="navbar navbar-inverse">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+
  <div class="container-fluid">
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
+
    <div class="navbar-header">
 +
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
 +
        <span class="icon-bar"></span>
 +
        <span class="icon-bar"></span>
 +
        <span class="icon-bar"></span>                       
 +
      </button>
 +
      <a class="navbar-brand" href="#">Harvard BioDesign 2015</a>
 +
    </div>
 +
    <div class="collapse navbar-collapse" id="myNavbar">
 +
      <ul class="nav navbar-nav">
 +
            <li><a href="https://2015.igem.org/Team:Harvard_BioDesign">Home</a></li>
 +
            <li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Team">Team</a></li>
 +
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Project">Project</a></li>
 +
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Results">Results</a></li>
 +
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Notebook">Notebook</a></li>
 +
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Parts">Parts</a></li>
 +
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Collaborations">Collaborations</a></li>
 +
     
 +
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Attributions">Attributions</a></li>
  
<style type="text/css">
+
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Practices">Practices</a></li>
  
.dropdown:hover .dropdown-menu {
+
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Safety">Safety</a></li>
display: block;}
+
      </ul>
 +
    </div>
 +
  </div>
 +
</nav>
 +
<div id="bannerContainer"></div>
  
/*general link type*/
+
</html>
a.nav {
+
font-type: "helvetica";
+
font-size: 24px;}
+
+
/* unvisited link */
+
a:link {
+
color: #000000;}
+
  
/* visited link */
+
<!--
a:visited {
+
color: #000000;}
+
  
/* mouse over link */
+
<html>
a:hover {
+
color: #666666;}
+
  
/* selected link */
+
<style type="text/css">
a:active {
+
color: #000000;}
+
  
ul {
+
.dropdown:hover .dropdown-menu {
list-style: none;
+
display: block;
padding: 5px;}
+
}
 
+
li {
+
list-style: none;
+
padding: 5px;}
+
 
+
#nav-box{
+
border-left-style: solid;
+
border-left-width: 3px;
+
margin-left: 20px}
+
  
  
 
</style>
 
</style>
  
 +
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
 +
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
 +
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
  
  <div id="nav-box">
+
<nav class="navbar navbar-inverse navbar-fixed-top">
  
       <ul>
+
  <div class="container-fluid">
         <li><a class="nav" href="https://2015.igem.org/Team:Harvard_BioDesign">Home</a></li>
+
    <div class="navbar-header">
         <li><a class="nav" href="https://2015.igem.org/Team:Harvard_BioDesign/Team">Team</a></li>
+
    </div>
<li class = "dropdown"><a class="dropdown-toggle nav" data-toggle="dropdown" href="https://2015.igem.org/Team:Harvard_BioDesign/Project">Project<span class="caret"></span></a>
+
  <div>
 +
       <ul class="nav navbar-nav">
 +
         <li class="active"><a href="https://2015.igem.org/Team:Harvard_BioDesign">Home</a></li>
 +
         <li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Team">Team</a></li>
 +
<li class = "dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="https://2015.igem.org/Team:Harvard_BioDesign/Project">Project <span class="caret"></span></a>
 
<ul class="dropdown-menu">
 
<ul class="dropdown-menu">
<li><a class="nav" href="https://2015.igem.org/Team:Harvard_BioDesign/Description">Description</a></li>
+
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Description">Description</a></li>
<li><a class="nav" href="https://2015.igem.org/Team:Harvard_BioDesign/Experiments">Experiments &amp; Protocols</a></li>  
+
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Experiments">Experiments &amp; Protocols</a></li>  
<li><a class="nav" href="https://2015.igem.org/Team:Harvard_BioDesign/Design">Design</a></li>
+
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Design">Design</a></li>
 
</ul>
 
</ul>
 
</li>
 
</li>
<li><a class="nav" href="https://2015.igem.org/Team:Harvard_BioDesign/Results">Results</a></li>
+
        <li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Results">Results</a></li>
<li class = "dropdown"><a class="dropdown-toggle nav" data-toggle="dropdown" href="https://2015.igem.org/Team:Harvard_BioDesign/Parts">Parts<span class="caret"></span></a>
+
<li class = "dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="https://2015.igem.org/Team:Harvard_BioDesign/Parts">Parts <span class="caret"></span></a>
 
<ul class="dropdown-menu">
 
<ul class="dropdown-menu">
<li><a class="nav" href="https://2015.igem.org/Team:Harvard_BioDesign/Basic_Part">Basic Parts</a></li>  
+
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Basic_Part">Basic Parts</a></li>  
<li><a class="nav" href="https://2015.igem.org/Team:Harvard_BioDesign/Composite_Part">Composite Parts</a></li>  
+
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Composite_Part">Composite Parts</a></li>  
<li><a class="nav" href="https://2015.igem.org/Team:Harvard_BioDesign/Part_Collection">Part Collection</a></li>
+
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Part_Collection">Part Collection</a></li>
 
</ul>
 
</ul>
 
</li>
 
</li>
  
<li><a class="nav" href="https://2015.igem.org/Team:Harvard_BioDesign/Notebook">Notebook</a></li>
+
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Notebook">Notebook</a></li>
 +
 +
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Collaborations">Collaborations</a></li>
 
        
 
        
<li><a class="nav" href="https://2015.igem.org/Team:Harvard_BioDesign/Attributions">Attributions</a></li>
+
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Attributions">Attributions</a></li>
  
<li><a class="nav" href="https://2015.igem.org/Team:Harvard_BioDesign/Practices">Practices</a></li>
+
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Practices">Practices</a></li>
  
<li><a class="nav" href="https://2015.igem.org/Team:Harvard_BioDesign/Safety">Safety</a></li>       
+
<li><a href="https://2015.igem.org/Team:Harvard_BioDesign/Safety">Safety</a></li>       
 
       </ul>
 
       </ul>
 
   </div>
 
   </div>
 +
  </div>
 +
</nav>
 +
 +
<div id="bannerContainer"></div>
  
 
</html>
 
</html>
 +
 +
-->

Latest revision as of 16:22, 13 July 2015

Bootstrap Collapsable Header