Difference between revisions of "Team:NUDT CHINA"
| Line 215: | Line 215: | ||
</script> | </script> | ||
<style type="text/css"> | <style type="text/css"> | ||
| + | .button-next{ | ||
| + | position: relative; | ||
| + | height: 10%; | ||
| + | margin-bottom: 0; | ||
| + | background: #fff; | ||
| + | border: 1px solid #fff; | ||
| + | border-radius: 4px; | ||
| + | color: #222; | ||
| + | font-size: 16px; | ||
| + | text-align: center; | ||
| + | cursor: pointer; | ||
| + | transition: .2s ease-in-out; | ||
| + | transform: translate(-50%, -50%); | ||
| + | } | ||
| + | .button-next:hover { | ||
| + | background: transparent; | ||
| + | color: #fff; | ||
| + | } | ||
.myheader{height: 100%; text-align: center; background-color: rgba(255,255,255,0.3);margin:0 auto;position: relative;} | .myheader{height: 100%; text-align: center; background-color: rgba(255,255,255,0.3);margin:0 auto;position: relative;} | ||
.content{width:100%;} | .content{width:100%;} | ||
| Line 223: | Line 241: | ||
#lay-menu li.active{ background:black; cursor:default;} | #lay-menu li.active{ background:black; cursor:default;} | ||
| − | .myheader img{width:100%; margin: 0;position: absolute; top: 50%;transform: translate(0, -50%); left: 0;} | + | .myheader img{width:100%; margin: 0;position: absolute; top: 50%;transform: translate(0, -50%); left: 0;max-height: 80%;} |
#loading div{ width:100%; height:50%; position:absolute; left:0; background:#009ee0; z-index:50; transition:1s;text-align: center;} | #loading div{ width:100%; height:50%; position:absolute; left:0; background:#009ee0; z-index:50; transition:1s;text-align: center;} | ||
#loading div:nth-of-type(1){ top:0;} | #loading div:nth-of-type(1){ top:0;} | ||
#loading div:nth-of-type(2){ bottom:0;} | #loading div:nth-of-type(2){ bottom:0;} | ||
#loading span{ width:0%; height:4px; background:white; position:absolute; left:0; top:50%; margin-top:-2px; z-index:60; transition:.10s;} | #loading span{ width:0%; height:4px; background:white; position:absolute; left:0; top:50%; margin-top:-2px; z-index:60; transition:.10s;} | ||
| − | |||
body { | body { | ||
color: #777; | color: #777; | ||
} | } | ||
| − | |||
#Qidilist .liList{ width:100%; position:relative; overflow:hidden;text-align: center;left:-30px;} | #Qidilist .liList{ width:100%; position:relative; overflow:hidden;text-align: center;left:-30px;} | ||
.big-bg{position:absolute; top:0;left:0;height:100%;width:100%; z-index:9;} | .big-bg{position:absolute; top:0;left:0;height:100%;width:100%; z-index:9;} | ||
| Line 248: | Line 264: | ||
} | } | ||
| − | .next-button {z-index:10;position: | + | .next-button {z-index:10;position:relative; |
| + | width: 20%; | ||
top: 40%; | top: 40%; | ||
left: 50%; | left: 50%; | ||
| Line 355: | Line 372: | ||
<ul id="Qidilist"> | <ul id="Qidilist"> | ||
<li id="abstract" class="liList"> | <li id="abstract" class="liList"> | ||
| − | <div class="myheader"id="main"><img class="strory-telling1" src="https://static.igem.org/mediawiki/2017/a/ad/T-NUDT_CHINA-story1.png" no-repeat; ></div> | + | <div class="myheader"id="main"><img class="strory-telling1" src="https://static.igem.org/mediawiki/2017/a/ad/T-NUDT_CHINA-story1.png" no-repeat; ><button class="button-next">Next</button></div> |
</li> | </li> | ||
<li id="abstract" class="liList"> | <li id="abstract" class="liList"> | ||
Revision as of 11:44, 25 October 2017
