"
Template:Team:USTC-Software/Header-c
From 2012.igem.org
(Difference between revisions)
| (6 intermediate revisions not shown) | |||
| Line 27: | Line 27: | ||
background-color: black; | background-color: black; | ||
background: url('https://static.igem.org/mediawiki/2012/c/ca/Ustc-software-2012-bg-hex.png'); | background: url('https://static.igem.org/mediawiki/2012/c/ca/Ustc-software-2012-bg-hex.png'); | ||
| + | background: url(' https://static.igem.org/mediawiki/igem.org/4/4e/Wiki-bg2.jpg'); | ||
| + | background: url('https://static.igem.org/mediawiki/igem.org/c/c5/Carbon_fibre.png'); | ||
margin:0 auto; | margin:0 auto; | ||
} | } | ||
| Line 54: | Line 56: | ||
margin-bottom:2px; | margin-bottom:2px; | ||
padding: 0px; | padding: 0px; | ||
| - | font-family: Optima,"Courier New",Courier, "Andale Mono", Monaco ; | + | font-family: Optima,"Courier New",Courier, "Andale Mono", Monaco ; |
| - | + | background-color:rgba(0, 0, 0, 0.35); | |
| - | background-color:rgba(0, 0, 0, 0.35) ; | + | background:transparent; |
position:relative; | position:relative; | ||
color: white; | color: white; | ||
| - | + | ||
} | } | ||
| Line 183: | Line 185: | ||
/*---the begin of head-text shade-shadow css-----*/ | /*---the begin of head-text shade-shadow css-----*/ | ||
.shade-shadow{ | .shade-shadow{ | ||
| - | font-size:58px;font-weight: bold;color:# | + | font-size:58px;font-weight: bold;color:rgba(255,255,255,.7);line-height:48px; |
| + | background:rgba(255,255,255,.7) -webkit-linear-gradient(-15deg,#080808 5%,rgba(255,255,255,.7), rgba(255,255,255,.9),rgba(255,255,255,.7),#222 10%) no-repeat; | ||
| + | -webkit-box-reflect:below 0 -webkit-linear-gradient(transparent,transparent 50%,rgba(255,255,255,.6)); | ||
| + | text-transform:uppercase; | ||
| + | |||
| + | |||
| + | -webkit-background-clip:text; | ||
| + | -webkit-text-fill-color:transparent; | ||
| + | -webkit-animation:texttop0 125s linear infinite; | ||
| + | -webkit-animation-delay:55ms; | ||
| + | } | ||
| + | |||
| + | |||
| + | .shade-shadow:hover{ | ||
| + | font-size:58px;font-weight: bold;color:#333; | ||
| + | line-height:48px; | ||
background:#888 -webkit-linear-gradient(-15deg,#080808 5%,rgba(255,255,255,.7), | background:#888 -webkit-linear-gradient(-15deg,#080808 5%,rgba(255,255,255,.7), | ||
rgba(255,255,255,.9),rgba(255,255,255,.7),#222 10%) no-repeat; | rgba(255,255,255,.9),rgba(255,255,255,.7),#222 10%) no-repeat; | ||
-webkit-box-reflect:below 0 -webkit-linear-gradient(transparent,transparent 50%,rgba(255,255,255,.6)); | -webkit-box-reflect:below 0 -webkit-linear-gradient(transparent,transparent 50%,rgba(255,255,255,.6)); | ||
-webkit-background-clip:text; | -webkit-background-clip:text; | ||
| - | -webkit-text-fill-color:transparent; | + | -webkit-text-fill-color:transparent; |
| - | -webkit-animation: | + | -webkit-animation:texttop 3400ms linear infinite; |
| + | -webkit-animation-direction:alternate; | ||
| + | -webkit-animation-delay:50ms; | ||
text-transform:uppercase; | text-transform:uppercase; | ||
} | } | ||
| - | @-webkit-keyframes | + | |
| + | @-webkit-keyframes texttop0{ | ||
| + | 0%{background-position:left 0;} | ||
| + | 100%{background-position:33000px 0;}} | ||
| + | |||
| + | @-webkit-keyframes texttop{ | ||
0%{background-position:left 0;} | 0%{background-position:left 0;} | ||
100%{background-position:1000px 0;}} | 100%{background-position:1000px 0;}} | ||
| - | /*---the end of head-text shade-shadow css-----*/ | + | /*---the end of head-text shade-shadow css-----*/ |
| - | + | ||
| + | |||
.unselectable { | .unselectable { | ||
| Line 311: | Line 336: | ||
<div id="wrap_header_menu"> | <div id="wrap_header_menu"> | ||
<ul class="header_menu"> | <ul class="header_menu"> | ||
| - | <li id="gn-home"><a href=" | + | <li id="gn-home"><a href="home" class="home_li">Home</a></li> |
| - | <li id="gn-pro"><a href="project | + | <li id="gn-pro"><a href="project" class="pro_li">Project</a></li> |
| - | <li id="gn-tec"><a href=" | + | <li id="gn-tec"><a href="technology" class="tec_li">Technology</a></li> |
| - | <li id="gn-ach"><a href=" | + | <li id="gn-ach"><a href="achivements" class="ach_li">Achivements</a></li> |
| - | <li id="gn-team"><a href="team | + | <li id="gn-team"><a href="team" class="team_li">Our Team</a></li> |
| - | <li id="gn-note"><a href=" | + | <li id="gn-note"><a href="notes" class="note_li">Notes</a></li> |
| - | <li id="gn-hp"><a href="hp | + | <li id="gn-hp"><a href="hp" class="hp_li">Human Practice</a></li> |
</ul> | </ul> | ||
</div><!---the end of header-menu div---> | </div><!---the end of header-menu div---> | ||
Latest revision as of 05:34, 15 August 2012
TOP
