Difference between revisions of "Team:SCAU-China"
LeeKartoon (Talk | contribs) |
|||
| Line 4: | Line 4: | ||
<style type="text/css"> | <style type="text/css"> | ||
| − | + | * { | |
| − | + | box-sizing: border-box; | |
| − | + | } | |
| − | + | a { | |
| − | + | text-decoration: none; | |
| − | + | } | |
| − | + | ul, | |
| − | + | ol { | |
| − | + | list-style: none; | |
| − | + | } | |
| − | + | body { | |
| − | + | font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; | |
| − | + | font-size: 14px; | |
| − | + | line-height: 1.42857143; | |
| − | + | color: #333; | |
| − | + | min-width: 768px; | |
| − | + | } | |
| − | + | .navbar-default { | |
| − | + | background-color: #EEE; | |
| − | + | border-color: #e7e7e7; | |
| − | + | top: 16px; | |
| − | + | border-width: 0 0 1px; | |
| − | + | position: fixed; | |
| − | + | right: 0; | |
| − | + | left: 0; | |
| − | + | z-index: 1030; | |
| − | + | min-height: 50px; | |
| − | + | margin-bottom: 20px; | |
| − | + | border: 1px solid transparent; | |
| − | + | min-width: 768px; | |
| − | + | } | |
| − | + | .container { | |
| − | + | padding-right: 15px; | |
| − | + | padding-left: 15px; | |
| − | + | margin-right: auto; | |
| − | + | margin-left: auto; | |
| − | + | } | |
| − | + | @media screen and (min-width: 768px) { | |
| − | + | .container { | |
| − | + | width: 750px; | |
| − | + | } | |
| − | + | } | |
| − | + | @media screen and (min-width: 992px) { | |
| − | + | .container { | |
| − | + | width: 970px; | |
| − | + | } | |
| − | + | } | |
| − | + | @media screen and (min-width: 1200px) { | |
| − | + | .container { | |
| − | + | width: 1170px; | |
| − | + | } | |
| − | + | } | |
| − | + | .navbar-header { | |
| − | + | float: left; | |
| − | + | } | |
| − | + | .navbar-brand { | |
| − | + | color: #777; | |
| − | + | float: left; | |
| − | + | height: 50px; | |
| − | + | padding: 15px 15px; | |
| − | + | font-size: 18px; | |
| − | + | line-height: 20px; | |
| − | + | } | |
| − | + | .navbar>ul>li { | |
| − | + | float: left; | |
| − | + | } | |
| − | + | .nav>li { | |
| − | + | position: relative; | |
| − | + | display: block; | |
| − | + | margin-right: 10px; | |
| − | + | } | |
| − | + | .nav>li>a { | |
| − | + | color: #777; | |
| − | + | position: relative; | |
| − | + | display: block; | |
| − | + | padding: 8px 15px; | |
| − | + | cursor: pointer; | |
| − | + | } | |
| − | + | .nav>li>a:hover { | |
| − | + | color: #333; | |
| − | + | } | |
| − | + | .caret { | |
| − | + | display: inline-block; | |
| − | + | width: 0; | |
| − | + | height: 0; | |
| − | + | margin-left: 2px; | |
| − | + | vertical-align: middle; | |
| − | + | border-top: 4px solid #777; | |
| − | + | border-right: 4px solid transparent; | |
| − | + | border-left: 4px solid transparent; | |
| − | + | position: absolute; | |
| − | + | top: 18px; | |
| − | + | right: 1px; | |
| − | + | } | |
| − | + | .nav>li>a:hover+span { | |
| − | + | border-top: 4px solid #333; | |
| − | + | } | |
| − | + | .nav>li .dropdown-menu { | |
| − | + | margin-top: 0; | |
| − | + | border-top-left-radius: 0; | |
| − | + | border-top-right-radius: 0; | |
| − | + | position: absolute; | |
| − | + | top: 35px; | |
| − | + | left: 0; | |
| − | + | z-index: 1000; | |
| − | + | float: left; | |
| − | + | min-width: 160px; | |
| − | + | padding: 5px 0; | |
| − | + | margin: 2px 0 0; | |
| − | + | font-size: 14px; | |
| − | + | text-align: left; | |
| − | + | list-style: none; | |
| − | + | background-color: #fff; | |
| − | + | -webkit-background-clip: padding-box; | |
| − | + | background-clip: padding-box; | |
| − | + | border: 1px solid #ccc; | |
| − | + | border: 1px solid rgba(0, 0, 0, .15); | |
| − | + | border-radius: 4px; | |
| − | + | -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175); | |
| − | + | box-shadow: 0 6px 12px rgba(0, 0, 0, .175); | |
| − | + | display: none; | |
| − | + | } | |
| − | + | .dropdown-menu>li { | |
| − | + | display: list-item; | |
| − | + | } | |
| − | + | .dropdown-menu>li>a { | |
| − | + | display: block; | |
| − | + | padding: 3px 20px; | |
| − | + | clear: both; | |
| − | + | font-weight: normal; | |
| − | + | line-height: 1.42857143; | |
| − | + | color: #333; | |
| − | + | white-space: nowrap; | |
| − | + | } | |
| − | + | .dropdown-menu>li>a:hover { | |
| − | + | background-color: #eee; | |
| − | + | } | |
| − | + | @font-face{ | |
font-family:'pinghei'; | font-family:'pinghei'; | ||
| − | src:url('https://static.igem.org/mediawiki/2018/5/5d/T--SCAU-China--pinghei.ttf') format('truetype'); | + | src:url('https://static.igem.org/mediawiki/2018/5/5d/T--SCAU-China--pinghei.ttf') format('truetype'); /*导入字体文件*/ |
} | } | ||
body{ | body{ | ||
| − | + | margin:0px; | |
| − | + | width:1300px; | |
| − | + | height:100%; | |
| − | + | ||
} | } | ||
#head1{ | #head1{ | ||
| − | + | position: relative; | |
| − | + | top:-120px; | |
| − | + | width: 100%; | |
| − | + | height:100%; | |
} | } | ||
.navbar-fixed-top { | .navbar-fixed-top { | ||
| − | + | top: 20px; | |
| − | + | border-width: 0 0 1px; | |
} | } | ||
#Title{ | #Title{ | ||
| − | + | width: 400px; | |
| − | + | position: relative; | |
| − | + | left: 40%; | |
| − | + | margin-top: -38%; | |
| − | + | font-family: 'pinghei'; | |
| − | + | font-size: 50px; | |
| − | + | color: white; | |
} | } | ||
#Title1{ | #Title1{ | ||
| − | + | position: relative; | |
| − | + | width: 400px; | |
| − | + | left: 37%; | |
margin-top: -1%; | margin-top: -1%; | ||
| − | + | font-family: 'pinghei'; | |
| − | + | font-size: 40px; | |
| − | + | color: white; | |
} | } | ||
#Title2{ | #Title2{ | ||
| − | + | position: relative; | |
| − | + | width: 400px; | |
| − | + | left: 39%; | |
margin-top: -1%; | margin-top: -1%; | ||
| − | + | font-family: 'pinghei'; | |
| − | + | font-size: 40px; | |
| − | + | color: white; | |
} | } | ||
| Line 215: | Line 215: | ||
position: relative; | position: relative; | ||
float: right; | float: right; | ||
| − | + | margin-top:20%; | |
| − | + | width: 60%; | |
| − | + | height:60%; | |
| + | } | ||
| + | #d1-t{ | ||
| + | position: relative; width: 600px;/*一定要限制字的宽度 否则滚动条会出问题*/ | ||
| + | margin-top:35%; | ||
| + | font-family: 'pinghei'; | ||
| + | font-size: 60px; | ||
| + | color: black; | ||
| + | left: 13%; | ||
| + | } | ||
| + | #d1-t1{ | ||
| + | position: relative; width: 600px; | ||
| + | margin-top:2%; | ||
| + | font-family: 'pinghei'; | ||
| + | font-size: 25px; | ||
| + | color: black; | ||
| + | left:5%; | ||
| + | } | ||
| + | #d1-t2{ | ||
| + | position: relative; width: 600px; | ||
| + | margin-top:0%; | ||
| + | font-family: 'pinghei'; | ||
| + | font-size: 25px; | ||
| + | color: black; | ||
| + | left: 5%; | ||
} | } | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
#img2{ | #img2{ | ||
position: relative; | position: relative; | ||
| − | + | margin-top:0%; | |
| − | + | width: 100%; | |
| − | + | height:100%; | |
} | } | ||
/*按钮*/ | /*按钮*/ | ||
#d2-t2{ | #d2-t2{ | ||
| − | + | position: relative; width: 130px; | |
| − | + | ||
| − | + | margin-top:0%; | |
| − | + | ||
| − | + | left: 0px; | |
| − | + | } | |
#ha{ | #ha{ | ||
| − | + | ||
| − | + | width: 150px; | |
| − | + | height: 65px; | |
| − | + | ||
| − | + | font-family:微软雅黑,宋体,Arial,Helvetica,Verdana,sans-serif; | |
| − | + | font-size:16px; | |
| − | + | color: white; | |
| − | + | left:600px; | |
| − | + | top: 20px; | |
| − | + | position: absolute; | |
| − | + | text-decoration:none; /*超链接无下划线*/ | |
| − | + | border-style:solid; | |
| − | + | border-width:2px; | |
| − | + | border-bottom-color:white ; | |
| − | + | border-left-color:white ;/*设置左边框颜色为黑色*/ | |
border-right-color:white ;/*设置右边框颜色为黑色*/ | border-right-color:white ;/*设置右边框颜色为黑色*/ | ||
| − | + | border-top-color:white ; | |
| − | + | border-radius: 5px; | |
text-align:center; | text-align:center; | ||
line-height:60px; | line-height:60px; | ||
| − | + | -webkit-transition:all linear 0.30s; | |
| − | + | -moz-transition:all linear 0.30s; | |
| − | + | transition:all linear 0.30s; | |
} | } | ||
| − | + | #d2-t2 a:hover { background:white;color: #1BBC9B; } | |
#d2-t{ | #d2-t{ | ||
| − | + | position: relative; width: 600px; | |
| − | + | margin-top:-23%; | |
| − | + | font-family: Arial,Helvetica,sans-serif,SimSun; | |
| − | + | font-size: 60px; | |
| − | + | color: white; | |
| − | + | left: 39%; | |
| − | + | } | |
| − | + | #d2-t1{ | |
| − | + | position: relative; width: 780px; | |
| − | + | margin-top:2%; | |
| − | + | font-family: Arial,Helvetica,sans-serif,SimSun;; | |
| − | + | font-size: 25px; | |
| − | + | color: white; | |
| − | + | left:35%; | |
| − | + | } | |
| + | |||
| − | |||
#content { | #content { | ||
| − | + | width: 103.5%; | |
| − | + | padding: 15px; | |
| − | + | border: none; | |
| − | + | color: black; | |
| − | + | margin-left: 20px; | |
| − | + | margin-right: auto; | |
| − | + | background-color: #ffffff; | |
| − | + | position: relative; | |
} | } | ||
#content { | #content { | ||
| − | + | position: relative; | |
| − | + | width: 103.5%; | |
| − | + | margin: 0 auto; | |
| − | + | padding: 5px 5px 5px 5px; | |
| − | + | background: white; | |
| − | + | color: black; | |
| − | + | border-left: 1px solid #444444; | |
| − | + | border-right: 1px solid #444444; | |
| − | + | line-height: 1.5em; | |
| − | + | z-index: 2; | |
} | } | ||
body { | body { | ||
| − | + | background-color:white; | |
} | } | ||
| Line 334: | Line 334: | ||
</style> | </style> | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | + | <div class="Tan MingYang"></div> | |
| − | + | <div class="Li JiaDong"></div> | |
| − | + | <div class="Huang XinLing"></div> | |
| − | + | ||
| − | + | <div class="navbar-default"> | |
| − | + | <div class="container"> | |
| − | + | <div class="navbar-header"> | |
| − | + | <a href="https://2018.igem.org/Team:SCAU-China" class="navbar-brand">SCAU-2018</a> | |
| − | + | </div> | |
| − | + | <div class="navbar"> | |
| − | + | <ul style="float: left;" class="nav"> | |
| − | + | <li class="dropdown"> | |
| − | + | <a href="javascript:void(0)">TEAM</a> | |
| − | + | <span class="caret"></span> | |
| − | + | <ul class='dropdown-menu'> | |
| − | + | <li> | |
| − | + | <a href="#">Time shaft</a> | |
| − | + | </li> | |
| − | + | <li> | |
| − | + | <a href="#">Members</a> | |
| − | + | </li> | |
| − | + | <li> | |
| − | + | <a href="#">Advisors</a> | |
| − | + | </li> | |
| − | + | <li> | |
| − | + | <a href="#">Teachers</a> | |
| − | + | </li> | |
| − | + | <li> | |
| − | + | <a href="#">Attributions</a> | |
| − | + | </li> | |
| − | + | <li> | |
| − | + | <a href="#">Collaborations</a> | |
| − | + | </li> | |
| − | + | </ul> | |
| − | + | </li> | |
| − | + | <li class="dropdown"> | |
| − | + | <a href="javascript:void(0)">PROJECT</a> | |
| − | + | <span class="caret"></span> | |
| − | + | <ul class='dropdown-menu'> | |
| − | + | <li><a href="https://2018.igem.org/Team:SCAU-China/Description">Description</a></li> | |
| − | + | <li><a href="#">Design</a></li> | |
| − | + | </ul> | |
| − | + | </li> | |
| − | + | <li class="dropdown"> | |
| − | + | <a href="javascript:void(0)">PART</a> | |
| − | + | <span class="caret"></span> | |
| − | + | <ul class='dropdown-menu'> | |
| − | + | <li><a href="#">Basic parts</a></li> | |
| − | + | <li><a href="https://2018.igem.org/Team:SCAU-China/interlab">interlab</a></li> | |
| − | + | </ul> | |
| − | + | </li> | |
| − | + | <li class="dropdown"> | |
| − | + | <a href="javascript:void(0)">RESULT</a> | |
| − | + | <span class="caret"></span> | |
| − | + | <ul class='dropdown-menu'> | |
| − | + | <li><a href="#">Experiments</a></li> | |
| − | + | <li><a href="#">Proof</a></li> | |
| − | + | <li><a href="#">Demonstrate</a></li> | |
| − | + | <li><a href="#">Model</a></li> | |
| − | + | </ul> | |
| − | + | </li> | |
| − | + | <li class="dropdown"> | |
| − | + | <a href="javascript:void(0)">NOTE</a> | |
| − | + | <span class="caret"></span> | |
| − | + | <ul class='dropdown-menu'> | |
| − | + | <li><a href="#">NoteBook</a></li> | |
| − | + | <li><a href="#">Gallery</a></li> | |
| − | + | <li><a href="https://2018.igem.org/Team:SCAU-China/Protocol">Protocol</a></li> | |
| − | + | </ul> | |
| − | + | </li> | |
| − | + | </ul> | |
| − | + | <ul style="float: right;" class="nav"> | |
| − | + | <li class="dropdown"> | |
| − | + | <a href="javascript:void(0)">SAFETY</a> | |
| − | + | <span class="caret"></span> | |
| − | + | <ul class='dropdown-menu'> | |
| − | + | <li><a href="https://2018.igem.org/Team:SCAU-China/Safety">Safety</a></li> | |
| − | + | </ul> | |
| − | + | </li> | |
| − | + | <li class="dropdown"> | |
| − | + | <a href="javascript:void(0)">HUMAN PRACTICES</a> | |
| − | + | <span class="caret"></span> | |
| − | + | <ul class='dropdown-menu'> | |
| − | + | <li><a href="#">Overview</a></li> | |
| − | + | <li><a href="#">Silver</a></li> | |
| − | + | <li><a href="https://2018.igem.org/Team:SCAU-China/Integrated">Integrated</a></li> | |
| − | + | <li><a href="#">Public Engagement & Education</a></li> | |
| − | + | <li><a href="#">Collaborations</a></li> | |
| − | + | ||
| − | + | </ul> | |
| − | + | </li> | |
| + | </ul> | ||
| + | </div> | ||
| + | </div> | ||
| + | </div> | ||
<div id="head"> | <div id="head"> | ||
| − | + | <img src="https://static.igem.org/mediawiki/2018/3/3a/T--SCAU-China--main.jpg" id="head1"> | |
| − | + | <!--<div id="Title">SCAU-2018</div> | |
| − | + | <div id="Title1">Anything you can do,</div> | |
| − | + | <div id="Title2">you can do better.</div>--> | |
</div> | </div> | ||
<div id="d2"> | <div id="d2"> | ||
| − | + | <img src="https://static.igem.org/mediawiki/2018/7/7e/T--SCAU-China--main2.jpg" id="img2"> | |
| − | + | <div id="d2-t">Descriptions </div> | |
| − | + | <div id="d2-t1">The Descriptions of SCAU-China 2018. | |
| + | </div> | ||
| + | <div id="d2-t2"><a id="ha" href="https://2018.igem.org/Team:SCAU-China/Description">Learn more</a></div> | ||
</div> | </div> | ||
| − | |||
| − | |||
| − | + | <div id="d1"> | |
| − | + | <img src="https://static.igem.org/mediawiki/2018/e/e1/T--SCAU-China--main1.jpg" id="img1"> | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | </div> | |
| − | + | <div id="d1-t"> Background</div> | |
| − | + | <div id="d1-t1">Land desertification,an international ecological problem</div> | |
| − | + | <div id="d1-t2">have an impact on food production and people's living environment.<a href="https://2018.igem.org/Team:SCAU-China/Background">Learn more about Background ></a></div> | |
| − | + | ||
| − | + | ||
| − | + | <script> | |
| − | + | var dropdownBoxs = document.getElementsByClassName('dropdown'); | |
| − | + | var dropdownMenus = document.getElementsByClassName('dropdown-menu'); | |
| − | + | for (let i = 0 ; i < dropdownBoxs.length ; i ++) { | |
| − | + | // console.log(dropdownBoxs[i]); | |
| − | + | // console.log(dropdownMenus[i]); | |
| − | + | dropdownBoxs[i].index = i; | |
| − | + | dropdownBoxs[i].onclick = function () { | |
| − | + | var styles = document.defaultView.getComputedStyle(dropdownMenus[i]) || dropdownMenus[i].currentStyle; | |
| − | + | // console.log(styles.display); | |
| − | + | if (styles.display == 'none') { | |
| − | + | for (let j = 0 ; j < dropdownBoxs.length ; j ++) { | |
| − | + | dropdownMenus[j].style.display = 'none'; | |
| − | + | dropdownMenus[i].style.display = 'block'; | |
| − | + | } | |
| − | + | } else { | |
| − | + | for (let j = 0 ; j < dropdownBoxs.length ; j ++) { | |
| + | dropdownMenus[j].style.display = 'none'; | ||
| + | } | ||
| + | } | ||
| + | } | ||
| + | } | ||
| + | </script> | ||
</html> | </html> | ||
Revision as of 08:57, 19 September 2018
Background
Land desertification,an international ecological problem
have an impact on food production and people's living environment.Learn more about Background >