"
Team:UESTC-Software/style.css
From 2014.igem.org
Tangying0608 (Talk | contribs) |
Tangying0608 (Talk | contribs) |
||
| Line 11: | Line 11: | ||
min-width: 500px; | min-width: 500px; | ||
background-color: #e7f0e2; | background-color: #e7f0e2; | ||
| - | + | font-family: arial,sans-serif; | |
} | } | ||
| + | |||
h1{ | h1{ | ||
text-align: center; | text-align: center; | ||
| Line 90: | Line 91: | ||
width: 100%; | width: 100%; | ||
} | } | ||
| - | + | ul{ | |
list-style-type: none; | list-style-type: none; | ||
| - | |||
display: inline-block; | display: inline-block; | ||
height: 100%; | height: 100%; | ||
| Line 98: | Line 98: | ||
margin: 0; | margin: 0; | ||
} | } | ||
| - | . | + | .UL li{ |
height: 100%; | height: 100%; | ||
cursor: pointer; | cursor: pointer; | ||
| Line 107: | Line 107: | ||
.rightUl,.rightUl li{ | .rightUl,.rightUl li{ | ||
float: right; | float: right; | ||
| + | } | ||
| + | .UL>li>ul{ | ||
| + | width: 100%; | ||
| + | height: initial; | ||
| + | padding-top: 10px; | ||
| + | position: relative; | ||
| + | border-radius: 5px; | ||
| + | background-color: rgba(0,0,0,.7); | ||
| + | color: #ddd; | ||
| + | } | ||
| + | .UL>li>ul>li{ | ||
| + | width: 100%; | ||
| + | text-align: center; | ||
| + | height: 40px; | ||
| + | } | ||
| + | .UL>li>ul>li:hover{ | ||
| + | background-color: rgba(0,0,0,.5); | ||
| + | } | ||
| + | .UL>li>ul>li>a{ | ||
| + | width: 100%; | ||
| + | height: 100%; | ||
| + | display: inline-block; | ||
| + | color: #fff; | ||
| + | text-decoration: blink; | ||
| + | padding-top: 10px; | ||
| + | } | ||
| + | .navbar .menu{ | ||
| + | cursor: default; | ||
| + | } | ||
| + | .menu>ul{ | ||
| + | display: none; | ||
} | } | ||
#nav_home{ | #nav_home{ | ||
| Line 118: | Line 149: | ||
} | } | ||
#nav_project:hover{ | #nav_project:hover{ | ||
| - | background: rgba( | + | background: rgba(0,0,0,.3) url("img/project.png") no-repeat center; |
} | } | ||
#nav_team{ | #nav_team{ | ||
| Line 130: | Line 161: | ||
} | } | ||
#nav_doc:hover{ | #nav_doc:hover{ | ||
| - | background: rgba( | + | background: rgba(0,0,0,.3) url("img/doc.png") no-repeat center; |
} | } | ||
#nav_reqrmt{ | #nav_reqrmt{ | ||
| Line 136: | Line 167: | ||
} | } | ||
#nav_reqrmt:hover{ | #nav_reqrmt:hover{ | ||
| - | background: rgba( | + | background: rgba(0,0,0,.3) url("img/reqrmt.png") no-repeat center; |
} | } | ||
#nav_notebk{ | #nav_notebk{ | ||
| Line 142: | Line 173: | ||
} | } | ||
#nav_notebk:hover{ | #nav_notebk:hover{ | ||
| - | background: rgba( | + | background: rgba(0,0,0,.3) url("img/notebk.png") no-repeat center; |
| + | } | ||
| + | #body>p{ | ||
| + | margin: 0 15%; | ||
| + | font-size: 22px; | ||
| + | line-height: 35px; | ||
| + | margin-top: 20px; | ||
| + | text-shadow: 0 0 1px #777; | ||
| + | } | ||
| + | .firstP:first-letter{ | ||
| + | font-size: 60px; | ||
| + | font-weight: bolder; | ||
| + | float: left; | ||
| + | } | ||
| + | |||
| + | .person{ | ||
| + | float: left; | ||
| + | } | ||
| + | .Tdescription{ | ||
| + | position: relative; | ||
| + | top: -400px; | ||
| + | height: 400px; | ||
| + | width: 100%; | ||
| + | background-color: rgba(0,0,0,.5); | ||
| + | color: #fff; | ||
| + | display: none; | ||
| + | } | ||
| + | .person img{ | ||
| + | opacity: .5; | ||
| + | } | ||
| + | #scrollTip{ | ||
| + | position: fixed; | ||
| + | bottom: 90px; | ||
| + | } | ||
| + | .board{ | ||
| + | background-color: #eee; | ||
| + | position: absolute; | ||
| + | top: 0; | ||
| + | right: 0; | ||
| + | border-left: 3px solid #8fc41f; | ||
| + | padding-bottom: 100px; | ||
| + | } | ||
| + | .time{ | ||
| + | font-family: 'Open Sans Condensed', sans-serif; | ||
| + | font-weight: 700; | ||
| + | font-size: 36px; | ||
| + | text-align: right; | ||
| + | position: relative; | ||
| + | margin-left: -100px; | ||
| + | display: inline-block; | ||
| + | color: #244910; | ||
| + | float: left; | ||
| + | } | ||
| + | .time.even .date{ | ||
| + | color: #01b9f4; | ||
| + | } | ||
| + | .month{ | ||
| + | color: #8fc41f; | ||
| + | } | ||
| + | .date{ | ||
| + | color: #e60012; | ||
| + | } | ||
| + | .content{ | ||
| + | max-width: 700px; | ||
| + | margin: 20px; | ||
| + | background-color: #ddd; | ||
| + | padding: 20px 25px; | ||
| + | border-radius: 5px; | ||
} | } | ||
Revision as of 12:32, 14 August 2014
.firstHeading{ display: none !important; } h1, h2, h3, h4, h5, h6{ border: 0; } html,body{ padding: 0; margin: 0; min-height: 500px; min-width: 500px; background-color: #e7f0e2; font-family: arial,sans-serif; }
h1{ text-align: center; }
- logoBox{
margin: auto; position: absolute; }
- logoBox img{
position: absolute; }
- home{
top: 164px; left: 43px; }
- project{
top: 240px; left: 10px; }
- team{
top: 295px; left: 55px; }
- document{
top: 91px; left: 192px; }
- requirment{
top: 171px; left: 300px; }
- notebook{
top: 294px; left: 230px; } .imenu{ display: none; } .imenu:hover{ opacity: .5; cursor: pointer; }
- logoRay{
border: solid 7px #8fc41f; position: absolute; } @keyframes logoShadow { from{box-shadow: 0 0 0 #8fc41f} to{box-shadow: 0 0 20px #8fc41f} } @-moz-keyframes logoShadow { from{box-shadow: 0 0 0 #8fc41f} to{box-shadow: 0 0 20px #8fc41f} } @-webkit-keyframes logoShadow { from{box-shadow: 0 0 0 #8fc41f;} to{box-shadow: 0 0 20px #8fc41f;} } @-o-keyframes logoShadow { from{box-shadow: 0 0 0 #8fc41f} to{box-shadow: 0 0 20px #8fc41f} }
- logo{
animation: logoShadow 1.3s ease 0 infinite alternate; -webkit-animation: logoShadow 1.3s ease 0 infinite alternate; }
.navbar{ background: url("img/nav_bg.png") repeat; height: 60px; position: fixed; bottom: 0; width: 100%; } ul{ list-style-type: none; display: inline-block; height: 100%; padding: 0; margin: 0; } .UL li{ height: 100%; cursor: pointer; } .leftUl,.leftUl li{ float: left; } .rightUl,.rightUl li{ float: right; } .UL>li>ul{ width: 100%; height: initial; padding-top: 10px; position: relative; border-radius: 5px; background-color: rgba(0,0,0,.7); color: #ddd; } .UL>li>ul>li{ width: 100%; text-align: center; height: 40px; } .UL>li>ul>li:hover{ background-color: rgba(0,0,0,.5); } .UL>li>ul>li>a{ width: 100%; height: 100%; display: inline-block; color: #fff; text-decoration: blink; padding-top: 10px; } .navbar .menu{ cursor: default; } .menu>ul{ display: none; }
- nav_home{
background: url("img/home.png") no-repeat center; }
- nav_home:hover{
background: rgba(255,255,255,.2) url("img/home.png") no-repeat center; }
- nav_project{
background: url("img/project.png") no-repeat center; }
- nav_project:hover{
background: rgba(0,0,0,.3) url("img/project.png") no-repeat center; }
- nav_team{
background: url("img/team.png") no-repeat center; }
- nav_team:hover{
background: rgba(255,255,255,.2) url("img/team.png") no-repeat center; }
- nav_doc{
background: url("img/doc.png") no-repeat center; }
- nav_doc:hover{
background: rgba(0,0,0,.3) url("img/doc.png") no-repeat center; }
- nav_reqrmt{
background: url("img/reqrmt.png") no-repeat center; }
- nav_reqrmt:hover{
background: rgba(0,0,0,.3) url("img/reqrmt.png") no-repeat center; }
- nav_notebk{
background: url("img/notebk.png") no-repeat center; }
- nav_notebk:hover{
background: rgba(0,0,0,.3) url("img/notebk.png") no-repeat center; }
- body>p{
margin: 0 15%; font-size: 22px; line-height: 35px; margin-top: 20px; text-shadow: 0 0 1px #777; } .firstP:first-letter{ font-size: 60px; font-weight: bolder; float: left; }
.person{ float: left; } .Tdescription{ position: relative; top: -400px; height: 400px; width: 100%; background-color: rgba(0,0,0,.5); color: #fff; display: none; } .person img{ opacity: .5; }
- scrollTip{
position: fixed; bottom: 90px; } .board{ background-color: #eee; position: absolute; top: 0; right: 0; border-left: 3px solid #8fc41f; padding-bottom: 100px; } .time{ font-family: 'Open Sans Condensed', sans-serif; font-weight: 700; font-size: 36px; text-align: right; position: relative; margin-left: -100px; display: inline-block; color: #244910; float: left; } .time.even .date{ color: #01b9f4; } .month{ color: #8fc41f; } .date{ color: #e60012; } .content{ max-width: 700px; margin: 20px; background-color: #ddd; padding: 20px 25px; border-radius: 5px; }
