Template:USTC-Software/header/css

From 2013.igem.org

(Difference between revisions)
Line 36: Line 36:
cursor: hand;
cursor: hand;
}
}
-
/*a:hover{text-decoration: underline;}*/
+
 
 +
 
#nav-strip ul {
#nav-strip ul {
margin:0;
margin:0;
Line 42: Line 43:
list-style:none;
list-style:none;
}
}
-
/* Header */
 
-
/*  Nav */
+
 
#nav-strip ul li.nav-item,
#nav-strip ul li.nav-item,
Line 51: Line 51:
/*border-left: 1px solid #373737;
/*border-left: 1px solid #373737;
border-right: 1px solid #181818;*/
border-right: 1px solid #181818;*/
-
}
+
}
 +
 
 +
 
#nav-strip {
#nav-strip {
margin:0;
margin:0;
Line 61: Line 63:
/*border-right: solid 1px #373737;
/*border-right: solid 1px #373737;
border-left: solid 1px #181818;
border-left: solid 1px #181818;
-
}
+
}
-
#nav-strip a:hover {
+
 
-
text-decoration:none;
+
 
-
}
+
#nav-strip a:hover { text-decoration:none;}
 +
 
 +
 
#nav-strip ul li.nav-item {
#nav-strip ul li.nav-item {
-
    display: inline;
+
        display: inline;
-
    float: left;
+
        float: left;
position:relative;
position:relative;
padding-top:15px;
padding-top:15px;
Line 73: Line 77:
height: 30px;
height: 30px;
text-align:center;
text-align:center;
-
}
+
}
 +
 
 +
 
#nav-strip ul li.nav-item:hover,
#nav-strip ul li.nav-item:hover,
-
#nav-strip ul li.nav-item.hover{
+
#nav-strip ul li.nav-item.hover{ background: #0D97F2;}
-
background: #0D97F2;
+
 
-
}
+
#nav-strip ul li.nav-item:hover a,  
#nav-strip ul li.nav-item:hover a,  
#nav-strip ul li.nav-item.hover a{color: #FFF;}/*鼠标接触时的颜色浓绿*/
#nav-strip ul li.nav-item.hover a{color: #FFF;}/*鼠标接触时的颜色浓绿*/
 +
#nav-strip ul li a{
#nav-strip ul li a{
-
/*font-weight: bold;*/
 
color: #000;
color: #000;
display:block;
display:block;
-
/*padding:10px;*/
 
font-size: 14px;/*主菜单字体大小*/
font-size: 14px;/*主菜单字体大小*/
-
}
+
}
-
/*#nav-strip ul li a .primary-link,
+
 
-
#nav-strip ul li.active a .primary-link,
+
 
-
#nav-strip ul li.hover a .primary-link{
+
-
background:  100% -10px no-repeat transparent;
+
-
padding-right: 10px;
+
-
}*/
+
-
/*#nav-strip ul li.no-subnav a .primary-link{
+
-
background: none;
+
-
padding-right: 0;
+
-
}*/
+
-
/*  subNav */
+
#nav-strip ul li .subnav {
#nav-strip ul li .subnav {
display: none;
display: none;
Line 103: Line 98:
background: #0D97F2;
background: #0D97F2;
top:45px;
top:45px;
-
/*left: -1px;
+
}
 +
 
-
border-top:1px solid #313131;
 
-
border-left: 1px solid #333;
 
-
border-right: 1px solid #333;
 
-
border-bottom: 1px solid #fff;
 
-
z-index: 9999;
 
-
min-width: 130px;
 
-
-webkit-box-shadow:0 0px 2px #000;
 
-
-moz-box-shadow:0 0px 2px #000;
 
-
box-shadow:0 0px 2px #000;
 
-
-webkit-border-bottom-left-radius:2px;
 
-
-webkit-border-bottom-right-radius:2px;
 
-
-moz-border-bottom-left-radius:2px;
 
-
-moz-border-bottom-right-radius:2px;
 
-
border-bottom-left-radius:2px;
 
-
border-bottom-right-radius:2px;*/
 
-
}
 
#nav-strip .subnav-inner {
#nav-strip .subnav-inner {
float: left;
float: left;
width: 130px;/*160 the width of menu when hovered*/
width: 130px;/*160 the width of menu when hovered*/
-
}
+
}
 +
 
 +
 
#nav-strip ul li .subnav ul{
#nav-strip ul li .subnav ul{
-
/*margin-bottom: 13px;*/
 
float: left;
float: left;
width: 130px;/*115*/
width: 130px;/*115*/
list-style:none;
list-style:none;
-
}
+
}
 +
 
 +
 
#nav-strip ul li .subnav ul li{
#nav-strip ul li .subnav ul li{
-
    display:block;
+
        display:block;
border-bottom:1px solid #fff;
border-bottom:1px solid #fff;
float:left;
float:left;
width: 130px;/*160px*/
width: 130px;/*160px*/
}
}
 +
#nav-strip ul li .subnav ul li a{font-weight: normal;margin-top:5px;height:20px; margin-bottom:2px;}
#nav-strip ul li .subnav ul li a{font-weight: normal;margin-top:5px;height:20px; margin-bottom:2px;}
 +
#nav-strip ul li .subnav ul li a,
#nav-strip ul li .subnav ul li a,
#nav-strip ul li.nav-item:hover .subnav ul li a{
#nav-strip ul li.nav-item:hover .subnav ul li a{
position: relative;
position: relative;
-
/*font-size: 14px;*/
 
color: #fff;
color: #fff;
-
/*white-space: nowrap;
 
-
white-space: normal;
 
-
_white-space: nowrap; */
 
text-align:center;
text-align:center;
}<!--下拉菜单的高度-->
}<!--下拉菜单的高度-->
 +
 +
#nav-strip ul li .subnav ul li a,
#nav-strip ul li .subnav ul li a,
-
#nav-strip ul li.nav-item:hover .subnav ul li a {white-space: normal;}
+
#nav-strip ul li.nav-item:hover .subnav ul li a { white-space: normal;}
 +
 
 +
 
#nav-strip ul li .subnav ul li.active a,
#nav-strip ul li .subnav ul li.active a,
-
#nav-strip ul li .subnav ul li a:hover {
+
#nav-strip ul li .subnav ul li a:hover { color:#000!important;}
-
+
-
color:#000!important;
+
-
}
+
Line 172: Line 154:
     transition: all .5s ease-out;
     transition: all .5s ease-out;
}
}
 +
 +
#team_logo a{
#team_logo a{
     color:#99cc99;
     color:#99cc99;

Revision as of 06:39, 8 August 2013

  1. top {

position: fixed; background: #0D97F2; width:100%; height:50px; z-index: 5000; top:0px; left:0px;

       border-radius: 0 0 5px 5px; 

-moz-border-radius: 0 0 5px 5px;

	-webkit-border-radius: 0 0 15px 15px;	

}


  1. header {

position: relative; background: url(USTC-Software_header_bg.png) no-repeat right top;

        border-radius: 0 0 5px 5px; 

-moz-border-radius: 0 0 5px 5px;

	 -webkit-border-radius: 0 0 15px 15px;

height: 45px; font-family: "Helvetica Neue","Arial",sans-serif; /*font-size: 14px;*/ border: 5px #0D97F2 solid; border-top-width:0px; max-width:1340px; width:100%; }


  1. nav-strip a {

color: #fff; text-decoration: none; cursor: pointer; cursor: hand; }


  1. nav-strip ul {

margin:0; padding:0; list-style:none; }


  1. nav-strip ul li.nav-item,
  2. nav-strip ul li.nav-item.active ,
  3. nav-strip ul li.nav-item:hover{

/*border-left: 1px solid #373737; border-right: 1px solid #181818;*/ }


  1. nav-strip {

margin:0; width: 670px;/*总宽度*/ height: 45px; position: absolute; z-index:9999; left:350px; /*border-right: solid 1px #373737; border-left: solid 1px #181818; }


  1. nav-strip a:hover { text-decoration:none;}


  1. nav-strip ul li.nav-item {
       display: inline;
       float: left;

position:relative; padding-top:15px; width:130px;/*主菜单宽*/ height: 30px; text-align:center; }


  1. nav-strip ul li.nav-item:hover,
  2. nav-strip ul li.nav-item.hover{ background: #0D97F2;}
  1. nav-strip ul li.nav-item:hover a,
  2. nav-strip ul li.nav-item.hover a{color: #FFF;}/*鼠标接触时的颜色浓绿*/
  1. nav-strip ul li a{

color: #000; display:block; font-size: 14px;/*主菜单字体大小*/ }


  1. nav-strip ul li .subnav {

display: none; position:absolute; background: #0D97F2; top:45px; }


  1. nav-strip .subnav-inner {

float: left; width: 130px;/*160 the width of menu when hovered*/ }


  1. nav-strip ul li .subnav ul{

float: left; width: 130px;/*115*/ list-style:none; }


  1. nav-strip ul li .subnav ul li{
       display:block;

border-bottom:1px solid #fff; float:left; width: 130px;/*160px*/ }


  1. nav-strip ul li .subnav ul li a{font-weight: normal;margin-top:5px;height:20px; margin-bottom:2px;}
  1. nav-strip ul li .subnav ul li a,
  2. nav-strip ul li.nav-item:hover .subnav ul li a{

position: relative; color: #fff; text-align:center; }


  1. nav-strip ul li .subnav ul li a,
  2. nav-strip ul li.nav-item:hover .subnav ul li a { white-space: normal;}


  1. nav-strip ul li .subnav ul li.active a,
  2. nav-strip ul li .subnav ul li a:hover { color:#000!important;}


  1. team_logo {
   width:290px; 
   height: 15px; 
   float: left;
   margin-top:0px;
   margin-left:60px;
   font-size:36px;
   font-family:"汉仪蝶语体简";
   -webkit-transition: all .5s ease-out;
   -moz-transition: all .5s ease-out;
   -o-transition: all .5s ease-out;
   -ms-transition: all .5s ease-out;
   transition: all .5s ease-out;

}


  1. team_logo a{
   color:#99cc99;
   text-decoration:none;
   text-shadow: 4px 3px 0.5px #666666;
   position:relative;
   -webkit-transition: color .5s ease-out;
   -moz-transition: color .5s ease-out;
   -o-transition: color .5s ease-out;
   -ms-transition: color .5s ease-out;
   transition: color .5s ease-out;

}

  1. team_logo a:active{
   text-shadow:6px 4px 1px black;
   left:1px;
   top:1px;

}

  1. team_logo:hover a{
  color:#0D97F2;

}

  1. igem {
    float:right;
    margin-top:-1px;
    margin-right:100px;
    background: url(USTC-Software_circle.png) no-repeat center;
    height:80px; 
    width:160px; 
    border-bottom-right-radius:1000px;
    border-bottom-left-radius:1000px;
    border-top-left-radius:0px;
    border-top-right-radius:0px;

}