Difference between revisions of "Team:Duke/NewTemplate"

Line 215: Line 215:
 
}
 
}
  
−
.circle{
+
#test{
 
border-radius:100%;
 
border-radius:100%;
 +
width:100px;
 +
height:100px;
 +
transition: background 0.5s ease;
 +
background-color: red;
 
}
 
}
 +
#test:hover{
 +
background-color: blue;
 +
}
 +
 +
#cf {
 +
  position:relative;
 +
  height:100px;
 +
  width:100px;
 +
  margin:0 auto;
 +
}
 +
 +
#cf img {
 +
  position:absolute;
 +
  border-radius:100%;
 +
  width:100px;
 +
  height:100px;
 +
  left:0;
 +
  -webkit-transition: opacity 1s ease-in-out;
 +
  -moz-transition: opacity 1s ease-in-out;
 +
  -o-transition: opacity 1s ease-in-out;
 +
  transition: opacity 1s ease-in-out;
 +
}
 +
 +
#cf img.top:hover {
 +
  opacity:0;
 +
}
 +
 
<!-- End Header-->
 
<!-- End Header-->
  
Line 288: Line 319:
 
<div id="contentContainer"> <!--The closing tag for contentContainer should be placed at the bottom of each content page.-->
 
<div id="contentContainer"> <!--The closing tag for contentContainer should be placed at the bottom of each content page.-->
  
−
<div>
+
<div id="test">
−
<a href="https://2015.igem.org/Team:Duke"><img class="circle" src="http://www.clickerzoneuk.co.uk/cz/wp-content/uploads/2010/10/PuppySmall.jpg"/></a>
+
<a href="https://2015.igem.org/Team:Duke">Home</a>
 
</div>
 
</div>
 +
 +
<div id="cf">
 +
  <img class="bottom" src="http://www.clickerzoneuk.co.uk/cz/wp-content/uploads/2010/10/PuppySmall.jpg" />
 +
  <img class="top" src="http://media.mydogspace.com.s3.amazonaws.com/wp-content/uploads/2013/08/puppy-500x350.jpg" />
 +
</div>
 +
  
 
</html>
 
</html>

Revision as of 19:55, 21 May 2015