Difference between revisions of "Team:ASTWS-China/test"
(Created page with "<html> <head> <meta http-equiv=Content-Type content="text/html; charset=utf-8"> <meta name=Generator content="Microsoft Word 15 (filtered)"> <style> <!-- /* Font Definitions...") |
|||
| (20 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
<html> | <html> | ||
| + | <head> | ||
| + | <meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1"> | ||
| + | <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> | ||
| + | <style> | ||
| + | |||
| + | |||
| + | /* //css rest end*/ | ||
| + | .mw-content-ltr ul, .mw-content-rtl .mw-content-ltr ul{ | ||
| + | margin: 0 !important; | ||
| + | } | ||
| + | |||
| + | #top_title{ | ||
| + | display: none; | ||
| + | } | ||
| + | html{ | ||
| + | height:100%; | ||
| + | width:100%; | ||
| + | } | ||
| + | body { | ||
| + | height:100%; | ||
| + | width:100%; | ||
| + | background-color: white; | ||
| + | } | ||
| + | |||
| + | #content{ | ||
| + | width:80%; | ||
| + | margin-top: 38px; | ||
| + | margin-left: auto; | ||
| + | } | ||
| + | |||
| + | #globalWrapper { | ||
| + | height:100%; | ||
| + | padding:0; | ||
| + | } | ||
| + | |||
| + | #nav_wrapper { | ||
| + | display: inline-block; | ||
| + | position: fixed; | ||
| + | left: 0; | ||
| + | top:18px; | ||
| + | width: 100%; | ||
| + | height: 74px; | ||
| + | text-align: center; | ||
| + | background-color:rgba(170,170,170,0.9); | ||
| + | box-shadow: 0 0 50px 0 rgba(0,0,0,0.35); | ||
| + | text-align: center; | ||
| + | z-index: 3; | ||
| + | } | ||
| + | |||
| + | #team_name{ | ||
| + | position: relative; | ||
| + | font-size: 32px; | ||
| + | } | ||
| + | |||
| + | .menu { | ||
| + | position: relative; | ||
| + | margin: 0; | ||
| + | padding: 0; | ||
| + | height: 100%; | ||
| + | font-size: 18px; | ||
| + | text-align: center; | ||
| + | } | ||
| + | |||
| + | .menu { | ||
| + | list-style-image: none; | ||
| + | } | ||
| + | |||
| + | /* Button */ | ||
| + | .menu li { | ||
| + | position: relative; | ||
| + | display: inline-block; | ||
| + | height: 100%; | ||
| + | line-height: 69px; | ||
| + | list-style-type: none; | ||
| + | transition: background-color 0.2s ease-in-out; | ||
| + | } | ||
| + | .menu li a { | ||
| + | display: block; | ||
| + | color:black; | ||
| + | text-decoration: none; | ||
| + | padding: 0 15px 0 15px !important; | ||
| + | } | ||
| + | .menu li:hover { | ||
| + | background-color: rgb(152,193,147); | ||
| + | } | ||
| − | + | .menu li:hover ul { | |
| − | + | visibility: visible; | |
| − | + | max-height: 700px; | |
| − | + | opacity: 1.0; | |
| − | + | margin: 0; | |
| − | + | } | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | /* Container */ | |
| + | .menu li ul { | ||
| + | max-height: 0; | ||
| + | opacity: 0.0; | ||
| + | font-weight: normal; | ||
| + | position: absolute; | ||
| + | left:0; | ||
| + | padding:0; | ||
| + | visibility: hidden; | ||
| + | background-color: rgba(200,200,200, 0.87); | ||
| + | text-align: left; | ||
| + | overflow:hidden; | ||
| + | box-shadow: 0px 9px 20px 0px rgba(0,0,0,0.2), inset 0px 35px 45px -35px rgba(0,0,0,0.5); | ||
| + | transition: all 0.3s ease-in-out; | ||
| + | } | ||
| − | <body | + | /* Element */ |
| + | .menu li ul li { | ||
| + | display: block; | ||
| + | padding: 0; | ||
| + | width: 100%; | ||
| + | min-width: 250px; | ||
| + | line-height: 55px; | ||
| + | white-space: nowrap; | ||
| + | } | ||
| + | .menu li ul li:hover { | ||
| + | background-color:unset; | ||
| + | } | ||
| + | .menu li ul li a { | ||
| + | transition: background-color 0.17s ease-in-out; | ||
| + | } | ||
| + | .menu li ul li a:hover { | ||
| + | background-color: rgb(152,193,147); | ||
| + | } | ||
| + | .menu .icon { | ||
| + | display: none; | ||
| + | } | ||
| + | |||
| + | @media screen and (max-width: 1000px) { | ||
| + | .menu li{ | ||
| + | display: block; | ||
| + | } | ||
| + | |||
| + | .menu li ul li a.icon { | ||
| + | float: right; | ||
| + | display: block; | ||
| + | } | ||
| + | } | ||
| + | |||
| + | @media screen and (max-width: 1000px) { | ||
| + | .menu.responsive li {position: relative;} | ||
| + | .menu.responsive li ul li a.icon { | ||
| + | position: absolute; | ||
| + | right: 0; | ||
| + | top: 0; | ||
| + | } | ||
| + | .menu.responsive li a { | ||
| + | float: none; | ||
| + | display: block; | ||
| + | text-align: center; | ||
| + | } | ||
| + | |||
| + | .menu.responsive li { | ||
| + | float: none; | ||
| + | } | ||
| + | .menu.responsive li ul { | ||
| + | position: relative; | ||
| + | } | ||
| + | .menu.responsive li ul li a{ | ||
| + | display: block; | ||
| + | width: 100%; | ||
| + | text-align: center; | ||
| + | } | ||
| + | } | ||
| + | |||
| + | </style> | ||
| + | |||
| + | <script> | ||
| + | function myFunction() { | ||
| + | var x = document.getElementById("mymenu"); | ||
| + | if (x.className === "menu li") { | ||
| + | x.className += " responsive"; | ||
| + | } | ||
| + | else { | ||
| + | x.className = "menu li"; | ||
| + | } | ||
| + | } | ||
| + | </script> | ||
| + | |||
| + | </head> | ||
| + | |||
| + | <body> | ||
| + | <div id="nav_wrapper"> | ||
| + | <div id="burger"></div> | ||
| + | <div class="menu_wrapper"> | ||
| + | <ul class="menu" id="mymenu"> | ||
| + | <li id="team_name"><a href="https://2018.igem.org/Team:ASTWS-China">ASTWS-China</a></li> | ||
| + | <li><a href="#">Project▾</a> | ||
| + | <ul> | ||
| + | <li><a href="https://2018.igem.org/Team:ASTWS-China/Attributions">Attributions</a></li> | ||
| + | <li><a href="https://2018.igem.org/Team:ASTWS-China/Demonstrate">Demonstrate</a></li> | ||
| + | <li><a href="https://2018.igem.org/Team:ASTWS-China/Description">Description</a></li> | ||
| + | <li><a href="https://2018.igem.org/Team:ASTWS-China/Design">Design</a></li> | ||
| + | <li><a href="https://2018.igem.org/Team:ASTWS-China/Improve">Improve</a></li> | ||
| + | <li><a href="https://2018.igem.org/Team:ASTWS-China/InterLab">InterLab</a></li> | ||
| + | <li><a href="https://2018.igem.org/Team:ASTWS-China/Model">Modeling</a></li> | ||
| − | < | + | </ul> |
| − | + | </li> | |
| − | < | + | <li><a href="#">Team▾</a> |
| − | + | <ul> | |
| − | < | + | <li><a href="https://2018.igem.org/Team:ASTWS-China/Team">Team</a></li> |
| − | + | <li><a href="https://2018.igem.org/Team:ASTWS-China/Collaborations">Collaborations</a></li> | |
| − | + | </ul> | |
| − | < | + | </li> |
| − | </ | + | |
| − | + | <li><a href="#">Awards▾</a> | |
| − | < | + | <ul> |
| − | < | + | <li><a href="https://2018.igem.org/Team:ASTWS-China/Applied_Design">Applied Design</a></li> |
| − | + | <li><a href="https://2018.igem.org/Team:ASTWS-China/Measurement">Measurement</a></li> | |
| − | < | + | </ul> |
| − | + | </li> | |
| − | < | + | |
| − | + | <li><a href="https://2018.igem.org/Team:ASTWS-China/Safety">Safety</a></li> | |
| − | < | + | |
| − | + | <li><a href="#">Human Practices▾</a> | |
| − | + | <ul> | |
| − | + | <li><a href="https://2018.igem.org/Team:ASTWS-China/Human_Practices">Silver</a></li> | |
| − | + | <li><a href="https://2018.igem.org/Team:ASTWS-China/Human_Practices#gold">Gold Integrated</a></li> | |
| − | < | + | </ul> |
| − | + | </li> | |
| − | + | ||
| − | + | <li><a href="https://igem.org/2018_Judging_Form?team=ASTWS-China">Judging Form</a></li> | |
| − | < | + | |
| − | + | <li><a href="javascript:void(0);" class="icon" onclick="myFunction()">☰</a></li> | |
| − | + | </ul> | |
| − | + | </div> | |
| − | + | </div> | |
| − | + | ||
| − | < | + | <h1>This is a test case.</h1> |
| − | + | </body> | |
| − | + | ||
| − | + | ||
| − | < | + | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | < | + | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | < | + | |
| − | + | ||
| − | < | + | |
| − | href=" | + | |
| − | + | ||
| − | </div> | + | |
| − | + | ||
| − | </body> | + | |
</html> | </html> | ||
Latest revision as of 00:17, 18 October 2018