|
|
(One intermediate revision by one other user not shown) |
Line 1: |
Line 1: |
| | | |
− | <html>
| |
− |
| |
− |
| |
− | <style type="text/css">
| |
− | * {
| |
− | box-sizing: border-box;
| |
− | }
| |
− |
| |
− | a {
| |
− | text-decoration: none;
| |
− | }
| |
− |
| |
− | ul,
| |
− | ol {
| |
− | list-style: none;
| |
− | }
| |
− |
| |
− | body {
| |
− | width:100%;
| |
− | 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';
| |
− | src:url('https://static.igem.org/mediawiki/2018/5/5d/T--SCAU-China--pinghei.ttf') format('truetype'); /*导入字体文件*/
| |
− | }
| |
− |
| |
− | body{
| |
− | margin:0px;
| |
− | width:1300px;
| |
− | height:100%;
| |
− |
| |
− | }
| |
− |
| |
− | #head1{
| |
− | position: relative;
| |
− | top:-120px;
| |
− | width: 100%;
| |
− | height:100%;
| |
− |
| |
− | }
| |
− | .navbar-fixed-top {
| |
− | top: 20px;
| |
− | border-width: 0 0 1px;
| |
− | }
| |
− | #Title{
| |
− | width: 400px;
| |
− | position: relative;
| |
− | left: 40%;
| |
− | margin-top: -38%;
| |
− | font-family: 'pinghei';
| |
− | font-size: 50px;
| |
− | color: white;
| |
− | }
| |
− | #Title1{
| |
− |
| |
− | position: relative;
| |
− | width: 400px;
| |
− | left: 37%;
| |
− | margin-top: -1%;
| |
− | font-family: 'pinghei';
| |
− | font-size: 40px;
| |
− | color: white;
| |
− | }
| |
− | #Title2{
| |
− | position: relative;
| |
− | width: 400px;
| |
− | left: 39%;
| |
− | margin-top: -1%;
| |
− | font-family: 'pinghei';
| |
− | font-size: 40px;
| |
− | color: white;
| |
− | }
| |
− |
| |
− | #img1{
| |
− | position: relative;
| |
− | 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{
| |
− | position: relative;
| |
− |
| |
− | margin-top:0%;
| |
− | width: 100%;
| |
− | height:100%;
| |
− | }
| |
− | /*按钮*/
| |
− | #d2-t2{
| |
− | position: relative; width: 130px;
| |
− |
| |
− | margin-top:0%;
| |
− | margin-left: auto;
| |
− | margin-right: auto;
| |
− | left: 0px;
| |
− | }
| |
− | #ha{
| |
− |
| |
− | width: 150px;
| |
− | height: 65px;
| |
− |
| |
− | margin-top: 20px;
| |
− | font-family:微软雅黑,宋体,Arial,Helvetica,Verdana,sans-serif;
| |
− | font-size:16px;
| |
− | color: white;
| |
− |
| |
− | 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-top-color:white ;
| |
− | border-radius: 5px;
| |
− |
| |
− | text-align:center;
| |
− | 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{
| |
− | position: relative;
| |
− | margin-top:-23%;
| |
− | font-family: Arial,Helvetica,sans-serif,SimSun;
| |
− | font-size: 60px;
| |
− | color: white;
| |
− | margin-left: auto;
| |
− | margin-right: auto;
| |
− | text-align: center;
| |
− | }
| |
− | #d2-t1{
| |
− | position: relative;
| |
− | margin-top:2%;
| |
− | font-family: Arial,Helvetica,sans-serif,SimSun;;
| |
− | font-size: 25px;
| |
− | color: white;
| |
− | margin-left: auto;
| |
− | margin-right: auto;
| |
− | text-align: center;
| |
− | }
| |
− |
| |
− |
| |
− | #content {
| |
− | width: 103.5%;
| |
− | padding: 15px;
| |
− | border: none;
| |
− | color: black;
| |
− | margin-left: 20px;
| |
− | margin-right: auto;
| |
− | background-color: #ffffff;
| |
− | position: relative;
| |
− | }
| |
− | #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;
| |
− | }
| |
− |
| |
− | #d2 {
| |
− | height: 600px;
| |
− | }
| |
− | body {
| |
− | background-color:white;
| |
− |
| |
− | margin: 0px;
| |
− | width: 100%;
| |
− | height: 100%;
| |
− |
| |
− | }
| |
− |
| |
− | </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="https://2018.igem.org/Team:SCAU-China/Collaborations">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="https://2018.igem.org/Team:SCAU-China/silver">Silver</a></li>
| |
− | <li><a href="https://2018.igem.org/Team:SCAU-China/integrated">Integrated</a></li>
| |
− | <li><a href="http://https://2018.igem.org/Team:SCAU-China/Engagement">Public Engagement & Education</a></li>
| |
− | <li><a href="https://2018.igem.org/Team:SCAU-China/Collaborations">Collaborations</a></li>
| |
− |
| |
− | </ul>
| |
− | </li>
| |
− | </ul>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− |
| |
− | <div id="head">
| |
− | <img src="https://static.igem.org/mediawiki/2018/c/c6/T--SCAU-China--overview.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 id="d2">
| |
− | <img src="https://static.igem.org/mediawiki/2018/7/7a/T--SCAU-China--timg1.JPG" id="img2">
| |
− | <div id="d2-t">Silver </div>
| |
− | <div id="d2-t1">The Human Practices - Silver of SCAU-China 2018.
| |
− |
| |
− | </div>
| |
− | <div id="d2-t2">
| |
− | <a id="ha" href="https://2018.igem.org/Team:SCAU-China/silver">Learn more</a>
| |
− | </div>
| |
− | </div>
| |
− |
| |
− |
| |
− |
| |
− | <div id="d2">
| |
− | <img src="https://static.igem.org/mediawiki/2018/4/47/T--SCAU-China--timg2.JPG" id="img2">
| |
− | <div id="d2-t">Integrated </div>
| |
− | <div id="d2-t1">Integrated Human Practices of SCAU-China 2018.
| |
− |
| |
− | </div>
| |
− | <div id="d2-t2">
| |
− | <a id="ha" href="https://2018.igem.org/Team:SCAU-China/integrated">Learn more</a>
| |
− | </div>
| |
− | </div>
| |
− |
| |
− | <div id="d2">
| |
− | <img src="https://static.igem.org/mediawiki/2018/b/b7/T--SCAU-China--timg3.JPG" id="img2">
| |
− | <div id="d2-t">Public Engagement & Education </div>
| |
− | <div id="d2-t2">
| |
− | <a id="ha" href="https://2018.igem.org/Team:SCAU-China/engagement">Learn more</a>
| |
− | </div>
| |
− | </div>
| |
− |
| |
− | <div id="d2">
| |
− | <img src="https://static.igem.org/mediawiki/2018/d/dd/T--SCAU-China--timg4.JPG" id="img2">
| |
− | <div id="d2-t">Collaborations </div>
| |
− | <div id="d2-t1">View Some University Team or High School of SCAU-China 2018.
| |
− |
| |
− | </div>
| |
− | <div id="d2-t2">
| |
− | <a id="ha" href="https://2018.igem.org/Team:SCAU-China/Collaborations">Learn more</a>
| |
− | </div>
| |
− | </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>
| |