Difference between revisions of "Team:Carnegie Mellon/navbar"

Line 1: Line 1:
 
<html>
 
<html>
 
     <head>
 
     <head>
−
    <style src = "" type = "text/css">
+
        <style src = "" type = "text/css">
  
−
#navbar ul {
+
nav a {
−
height: auto;
+
text-decoration: none;
−
padding: 30px 8px;
+
font-weight: bold;
−
margin: 0px;
+
color: #f50fdd;
−
}
+
}
  
−
#navbar li {
+
nav ul ul {
−
display: inline;
+
display: none;
−
padding: 40px;
+
}
−
}
+
  
−
#navbar{
+
nav ul li:hover > ul {
−
font-weight: bold;
+
display: block;
−
background-color: yellow;
+
}
−
}
+
  
−
#navbar a {
+
nav ul {
−
text-decoration: none;
+
background: yellow;
−
color: #00F;
+
padding: 0 20px;
−
padding: 8px 8px 8px 8px;
+
border-radius: 10px; 
 +
list-style: none;
 +
position: relative;
 +
display: inline-table;
 +
}
 +
nav ul:after {
 +
content: ""; clear: both; display: block;
 +
}
 +
 
 +
nav ul li {
 +
float: left;
 +
}
 +
nav ul li:hover {
 +
background: white;
 +
}
 +
nav ul li:hover a {
 +
color: orange;
 
}
 
}
 +
 +
nav ul li a {
 +
display: block; padding: 25px 40px;
 +
color: #81df62; text-decoration: none;
 +
}
  
−
#navbar a:hover{
+
nav ul ul {
−
color: #F90;
+
background: #81df62; border-radius: 0px; padding: 0;
−
background-color: #FFF;
+
position: absolute; top: 100%;
−
}
+
}
 +
nav ul ul li {
 +
float: none;
 +
border-top: 1px solid #81df62;
 +
border-bottom: 1px solid #575f6a;
 +
position: relative;
 +
}
 +
nav ul ul li a {
 +
padding: 15px 40px;
 +
color: black;
 +
}
 +
nav ul ul li a:hover {
 +
background: black;
 +
}
 +
 
 +
nav ul ul ul {
 +
position: absolute; left: 100%; top:0;
 +
}
  
−
    </style>
+
        </style>
 
     </head>
 
     </head>
  
−
<body>
+
<body>
−
              <div id = "navbar">
+
<nav>
−
<ul>
+
<ul>
−
<li> <a href = "https://2015.igem.org/Team:Carnegie_Mellon"> Home </a> </li>
+
<li> <a href = "https://2015.igem.org/Team:Carnegie_Mellon"> Home </a> </li>
−
<li> <a href = "https://2015.igem.org/Team:Carnegie_Mellon/Team"> Team </a> </li>
+
<li> <a href = "https://2015.igem.org/Team:Carnegie_Mellon/Team"> Team </a>
−
<li> <a href = "https://2015.igem.org/Team:Carnegie_Mellon/Description"> Project </a> </li>
+
<ul>
−
<li> <a href = "https://2015.igem.org/Team:Carnegie_Mellon/Notebook"> Notebook </a> </li>
+
<li><a href="www.twitter.com">tweeter</a></li>
−
<li> <a href = "https://2015.igem.org/Team:Carnegie_Mellon/Practices"> Human Practices </a> </li>
+
<li><a href="www.google.com">the googs</a></li>
−
<li> <a href =" https://2015.igem.org/Team:Carnegie_Mellon/Modeling"> Modeling </a> </li>
+
<li><a href="www.tumblr.com">tumbles</a></li>
−
</ul>
+
</ul>
−
                </div>
+
</li>
−
</body>
+
<li><a href="https://2015.igem.org/Team:Carnegie_Mellon/Description">Project</a>
 +
<ul>
 +
<li><a href="https://2015.igem.org/Team:Carnegie_Mellon/Modeling">Modeling</a></li>
 +
<li><a href="https://2015.igem.org/Team:Carnegie_Mellon/Measurement">Measurement</a></li>
 +
</ul>
 +
</li>
 +
<li><a href="https://2015.igem.org/Team:Carnegie_Mellon/Practices">Human Practices</a></li>
 +
</ul>
 +
</nav>
 +
</body>
  
 
</html>
 
</html>

Revision as of 19:11, 10 June 2015