Team:Glendale CC AZ/CSS

From 2013.igem.org

(Difference between revisions)
(Blanked the page)
 
(6 intermediate revisions not shown)
Line 1: Line 1:
-
<html>
 
-
<head>
 
-
<script type="text/javascript">
 
-
//binding click event on li elements to having good active element
 
-
$("li").click(function(){
 
-
  $("li").removeAttr("class");
 
-
  $(this).addClass("active");
 
-
});
 
-
</script>
 
-
<style>
 
-
body
 
-
{
 
-
  background: url('http://uploadfa.net/uploads/13490193031.png') repeat;
 
-
}
 
-
aside
 
-
{
 
-
  margin-left: 139px;
 
-
  width: 220px;
 
-
  height: 270px;
 
-
  background-color: #fff;
 
-
  border: solid thin rgb(223,223,223);
 
-
  padding-top: 38px;
 
-
  margin-top: 23px;
 
-
  font-family: Arial;
 
-
}
 
-
 
-
li
 
-
{
 
-
  padding: 9px 0 8px 26px;
 
-
  margin: 10px 0 9px 0;
 
-
  cursor: pointer;
 
-
  color: #000;
 
-
  transition: color .3s linear;
 
-
  -webkit-transition: color .3s linear;
 
-
  -moz-transition: color .3s linear;
 
-
  -o-transition: color .3s linear;
 
-
}
 
-
 
-
li:not(.active):hover
 
-
{
 
-
  color: rgb(190,39,0);
 
-
}
 
-
 
-
a
 
-
{
 
-
  text-decoration: none;
 
-
  color: inherit;
 
-
}
 
-
 
-
.active
 
-
{
 
-
  background-color: rgb(190,39,0);
 
-
  background-position: left center;
 
-
  border-left: solid 15px rgb(190,39,0);
 
-
  position: relative;
 
-
  left: -15px;
 
-
  color: #fff;
 
-
}
 
-
</style>
 
-
 
-
<meta charset="utf-8">
 
-
 
-
</head>
 
-
 
-
 
-
<body>
 
-
<aside>
 
-
  <ul>
 
-
    <li class="active"><a href="#">Profile Settings</a></li>
 
-
    <li><a href="#">Connected Networks</a></li>
 
-
    <li><a href="#">Email Settings</a></li>
 
-
    <li><a href="#">Privacy Settings</a></li>
 
-
    <li><a href="#">Authorized Sites</a></li>
 
-
  </ul>
 
-
</aside>
 
-
</body>
 
-
</html>
 

Latest revision as of 06:26, 23 September 2013