Difference between revisions of "Team:UNebraska-Lincoln/sponsors"

m (Further Improved the Dimensions of the Sponsor Images)
m (test font)
 
(4 intermediate revisions by the same user not shown)
Line 1: Line 1:
−
<html lang=en>
+
<!DOCTYPE html>
 +
<html>
 
<head>
 
<head>
−
<meta charset=utf-8>
+
<style>
−
<title>2017 UNL iGEM</title>
+
−
<style type="text/css">
+
 
@import url('https://fonts.googleapis.com/css?family=Josefin+Slab');
 
@import url('https://fonts.googleapis.com/css?family=Josefin+Slab');
  
−
body{
+
.container {
−
font-family:Josefin Slab, Arial;
+
    overflow: hidden;
−
background:url(http://images.clipartpanda.com/cow-clipart-cow-clip-art-clipart-grass-eating-cow-512x512-0388.png) right top no-repeat, /*url(https://thumb9.shutterstock.com/display_pic_with_logo/537364/537364,1302449343,2/stock-vector--long-seaweed-background-74954500.jpg)*/
+
    background-color: #333;
−
#35594f;
+
−
background-size:150px, 300px;
+
−
background-attachment:fixed, scroll;
+
 
}
 
}
  
−
header{
+
.container a {
−
background-color:#34af8f;
+
    float: left;
−
width:80%;
+
    font-size: 16px;
−
margin-right:auto;
+
    color: white;
−
margin-left:auto;
+
    text-align: center;
−
padding:10px;
+
    padding: 14px 16px;
 +
    text-decoration: none;
 
}
 
}
  
−
footer{
+
.dropdown {
−
width:81.2%;
+
    float: left;
−
border-style:solid;
+
    overflow: hidden;
−
border-top-style:none;
+
−
border-color:black;
+
−
margin-left:auto;
+
−
margin-right:auto;
+
 
}
 
}
  
−
nav{
+
.dropdown .dropbtn {
−
background-color:#1f4945;
+
    font-size: 16px;   
−
padding:10px;
+
    border: none;
 +
    outline: none;
 +
    color: white;
 +
    padding: 14px 16px;
 +
    background-color: inherit;
 
}
 
}
  
−
section{
+
.container a:hover, .dropdown:hover .dropbtn {
−
background-color:#54968f;
+
    background-color: red;
−
width:79.8%;
+
−
margin-right:auto;
+
−
margin-left:auto;
+
−
padding:10px;
+
−
border-style:solid;
+
−
border-color:black;
+
 
}
 
}
  
−
a:link{
+
.dropdown-content {
−
color:#60eadd;
+
    display: none;
−
text-decoration:none;
+
    position: absolute;
 +
    background-color: #f9f9f9;
 +
    min-width: 160px;
 +
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
 +
    z-index: 1;
 
}
 
}
  
−
a:visited{
+
.dropdown-content a {
−
color:red;
+
    float: none;
−
text-decoration:none;
+
    color: black;
 +
    padding: 12px 16px;
 +
    text-decoration: none;
 +
    display: block;
 +
    text-align: left;
 
}
 
}
  
−
a:hover, a:active{
+
.dropdown-content a:hover {
−
color:red;
+
    background-color: #ddd;
−
text-decoration:underline;
+
 
}
 
}
  
−
p{
+
.dropdown:hover .dropdown-content {
−
font-size:1.1em;
+
    display: block;
−
font-weight:bold;
+
−
}
+
−
 
+
−
h1{
+
−
font-weight:bold;
+
−
font-size:2em;
+
 
}
 
}
 
</style>
 
</style>
Line 74: Line 66:
 
<body>
 
<body>
  
−
<header>
+
<div class="container">
−
 
+
  <a href="#home" style="font-family:Josefin Slab;">Home</a>
−
<hgroup>
+
  <a href="#news">News</a>
−
<h1 style=margin-bottom:0px;>UNL <span style=font-style:italic;>Sea. cowli</span></h1>
+
  <div class="dropdown">
−
<h2 style=font-size:15px;margin-top:0px;>Helping reduce methane emissions from livestock</h2>
+
    <button class="dropbtn">Dropdown</button>
−
</hgroup>
+
    <div class="dropdown-content">
−
 
+
      <a href="#">Link 1</a>
−
<nav class=header style=border-style:solid;>
+
      <a href="#">Link 2</a>
−
<a href=https://2017.igem.org/Team:UNebraska-Lincoln>Home</a>
+
      <a href="#">Link 3</a>
−
<a href=https://2017.igem.org/Team:UNebraska-Lincoln/sponsors>Sponsors</a>
+
    </div>
−
</nav>
+
  </div>  
−
 
+
  <a href="#news">Link</a>
−
</header>
+
</div>
−
 
+
−
<section>
+
−
 
+
−
<h2>Sponsors:</h2>
+
−
 
+
−
<hr>
+
−
 
+
−
<img src=http://unlcms.unl.edu/computer-science-engineering/igem/pictures/ucare_logo.jpg alt="UNL UCARE" style=height:90px;>
+
−
 
+
−
<img src=http://unlcms.unl.edu/computer-science-engineering/igem/pictures/sponsors/Chemical%20%26%20Bio%20Engineering.JPG alt="UNL College of Engineering Chemical & Biomolecular Engineering" style=height:90px;>
+
−
 
+
−
<img src=http://unlcms.unl.edu/computer-science-engineering/igem/pictures/sponsors/Computer%20Science%20and%20Engineering%20Department%20Logo.JPG alt="UNL College of Arts & Sciences and College of Engineering Computer Science and Engineering" style=height:90px;>
+
−
 
+
−
<img src=http://unlcms.unl.edu/computer-science-engineering/igem/pictures/sponsors/UNL%20Chemistry%20Department.JPG alt="UNL College of Arts and Sciences Department of Chemistry" style=height:90px;>
+
−
 
+
−
<img src=http://unlcms.unl.edu/computer-science-engineering/igem/pictures/sponsors/biochemistry_logo.png alt="UNL Institute of Agriculture and Natural Resources and College of Arts & Sciences Biochemistry" style=height:90px;>
+
−
 
+
−
<img src=http://unlcms.unl.edu/computer-science-engineering/igem/pictures/sponsors/biological_systems_engineering.png alt="UNL Institue of Agriculture and Natural Resources and College of Engineering Biological Systems Engineering Department" style=height:90px;>
+
−
 
+
−
<img src=http://unlcms.unl.edu/computer-science-engineering/igem/pictures/sponsors/IDT_logo_trans.png alt="IDT Integrated DNA Technologies" style=height:90px;>
+
−
 
+
−
<img src=http://unlcms.unl.edu/computer-science-engineering/igem/pictures/sponsors/neb_logo_409.png alt="New England BioLabs" style=height:150px;>
+
−
 
+
−
<img src=http://unlcms.unl.edu/computer-science-engineering/igem/pictures/snapgene.png alt="SnapGene" style=height:90px;>
+
−
 
+
−
<img src=http://unlcms.unl.edu/computer-science-engineering/igem/pictures/agilent.gif alt="Agilent Techonologies" style=height:90px;>
+
−
 
+
−
 
+
−
</section>
+
  
−
<footer>
+
<h3>Dropdown Menu inside a Navigation Bar</h3>
 +
<p>Hover over the "Dropdown" link to see the dropdown menu.</p>
  
−
<nav class=footer>
 
−
<a href=http://igem.unl.edu/>igem.unl.edu</a>
 
−
</nav>
 
−
</footer>
 
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 15:34, 12 July 2017

<!DOCTYPE html>

Home News
Link 1 Link 2 Link 3
Link

Dropdown Menu inside a Navigation Bar

Hover over the "Dropdown" link to see the dropdown menu.