|
|
(5 intermediate revisions by one other user not shown) |
Line 1: |
Line 1: |
− | {{ShanghaitechChina}}
| |
− | <html>
| |
− | <style>
| |
− | html, body, div, span, p, a, del, em, img, ol, ul, li, fieldset, form, label {
| |
− | margin: 0;
| |
− | padding: 0;
| |
− | border: 0;
| |
− | font-size: 100%;
| |
− | font: inherit;
| |
− | vertical-align: baseline;
| |
− | }
| |
| | | |
− | article, aside, details, figcaption, figure,
| |
− | footer, header, hgroup, menu, nav, section {
| |
− | display: block;
| |
− | }
| |
− |
| |
− | html, body {
| |
− | line-height: 1;
| |
− | min-height:100%; font-size:18px;
| |
− | /*font-family: 'Droid Sans', sans-serif;*/
| |
− |
| |
− | }
| |
− |
| |
− | body {
| |
− | background: #eeeeee;
| |
− | background: -webkit-linear-gradient(top, #eeeeee, #cccccc 100%);
| |
− | background: -moz-linear-gradient(top, #eeeeee, #cccccc 100%);
| |
− | background: -o-linear-gradient(top, #eeeeee, #cccccc 100%);
| |
− | background: -ms-linear-gradient(top, #eeeeee, #cccccc 100%);
| |
− | background: linear-gradient(top, #eeeeee, #cccccc 100%);
| |
− | background-attachment:fixed;
| |
− | }
| |
− |
| |
− | h1 {
| |
− | font-size:24px;
| |
− | margin:0;
| |
− | }
| |
− |
| |
− | h1 > small {
| |
− | text-align:right;
| |
− | display:inline-block;
| |
− | font-size:.71em;
| |
− | text-indent:15em;
| |
− | color:#444;
| |
− | }
| |
− |
| |
− | h2 {
| |
− | color:inherit;
| |
− | font-size:18px;
| |
− | margin:2em 0 1em 0;
| |
− | }
| |
− |
| |
− | h2:first-child {margin-top:0;}
| |
− |
| |
− | h3 {
| |
− | color:#333;
| |
− | font-size:1.41em;
| |
− | margin:1em 0;
| |
− | }
| |
− |
| |
− | h4 {
| |
− | color:#444;
| |
− | font-size:1.11em;
| |
− | margin:1em 0;
| |
− | }
| |
− |
| |
− |
| |
− |
| |
− | html, body {
| |
− | width:100%;
| |
− | height:100%;
| |
− | padding:0;
| |
− | margin:0;
| |
− | overflow-x:hidden;
| |
− | }
| |
− |
| |
− | .skrollable {
| |
− | /*
| |
− | * First-level skrollables are positioned relative to window
| |
− | */
| |
− | position:fixed;
| |
− |
| |
− | /*
| |
− | * Skrollables by default have a z-index of 100 in order to make it easy to position elements in front/back without changing each skrollable
| |
− | */
| |
− | z-index:100;
| |
− | }
| |
− |
| |
− | .skrollr-mobile .skrollable {
| |
− | /*
| |
− | May cause issues on Android default browser (see #331 on GitHub).
| |
− | */
| |
− | position:absolute;
| |
− | }
| |
− |
| |
− | .skrollable .skrollable {
| |
− | /*
| |
− | * Second-level skrollables are positioned relative their parent skrollable
| |
− | */
| |
− | position:absolute;
| |
− | }
| |
− |
| |
− | .skrollable .skrollable .skrollable {
| |
− | /*
| |
− | * Third-level (and below) skrollables are positioned static
| |
− | */
| |
− | position:static;
| |
− | }
| |
− |
| |
− |
| |
− | #progress {
| |
− | height:4px;
| |
− | background:#444;
| |
− | bottom:0;
| |
− | z-index:200;
| |
− | }
| |
− |
| |
− | #bg1, #bg2, #bg3, #bg4 {
| |
− | z-index:50;
| |
− | top:0;
| |
− | left:0;
| |
− | width:100%;
| |
− | height:100%;
| |
− | background:url("https://static.igem.org/mediawiki/2016/1/12/Bubbles_back.png") repeat 0 0;
| |
− | }
| |
− |
| |
− | #bg2 {
| |
− | z-index:49;
| |
− | background-image:url("https://static.igem.org/mediawiki/2016/f/fd/Bubbles2.png");
| |
− | }
| |
− |
| |
− | #bg3 {
| |
− | z-index:48;
| |
− | background-image:url("https://static.igem.org/mediawiki/2016/2/23/Bubbles3.png");
| |
− | }
| |
− | #bg4 {
| |
− | z-index:48;
| |
− | background-image:url("https://static.igem.org/mediawiki/2016/b/b3/Bubbles4.png");
| |
− | }
| |
− |
| |
− | #intro {
| |
− | width:80%;
| |
− | left:50%;
| |
− | top:1em;
| |
− | margin-left:-40%;
| |
− | padding:2em;
| |
− | background:#fff;
| |
− | text-align:center;
| |
− | border-radius:1em;
| |
− |
| |
− | -webkit-transform-origin:0 0;
| |
− | -moz-transform-origin:0 0;
| |
− | -ms-transform-origin:0 0;
| |
− | -o-transform-origin:0 0;
| |
− | transform-origin:0 0;
| |
− |
| |
− | -webkit-box-sizing: border-box;
| |
− | -moz-box-sizing: border-box;
| |
− | box-sizing: border-box;
| |
− | }
| |
− |
| |
− | #intro .arrows {
| |
− | font-size:2em;
| |
− | color:#09f;
| |
− | }
| |
− |
| |
− | #transform {
| |
− | width:70%;
| |
− | left:50%;
| |
− | top:20%;
| |
− | margin-left:-35%;
| |
− | text-align:center;
| |
− | font-size:150%;
| |
− |
| |
− | .transform-origin(50%, 50%);
| |
− | }
| |
− |
| |
− | #properties {
| |
− | width:100%;
| |
− | height:100%;
| |
− | padding-top:10%;
| |
− | text-align:center;
| |
− |
| |
− | -webkit-box-sizing: border-box;
| |
− | -moz-box-sizing: border-box;
| |
− | box-sizing: border-box;
| |
− | }
| |
− |
| |
− |
| |
− |
| |
− | #end {
| |
− | width:60%;
| |
− | left:20%;
| |
− | height:80%;
| |
− | padding:3em;
| |
− | border:0 solid #666;
| |
− | text-align:center;
| |
− |
| |
− | -webkit-box-sizing: border-box;
| |
− | -moz-box-sizing: border-box;
| |
− | box-sizing: border-box;
| |
− | }
| |
− | .content {
| |
− | background-color: white;
| |
− | border: 1px solid #cccccc;
| |
− | border-radius: 10px;
| |
− | box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.35);
| |
− | color: #3d3d3d;
| |
− | font-family: Tahoma;
| |
− | font-size: 14px;
| |
− | margin-left: 5%;
| |
− | margin-top: 50px;
| |
− | padding: 15px 60px;
| |
− | width: 80%;
| |
− | }
| |
− | #easing {
| |
− | top:10%;
| |
− | width:50%;
| |
− | z-index:101;
| |
− | }
| |
− |
| |
− | .drop {
| |
− | background:#09f;
| |
− | font-weight:bold;
| |
− | padding:1em;
| |
− | }
| |
− | #easing_wrapper {
| |
− | width:100%;
| |
− | height:100%;
| |
− | }
| |
− | </style>
| |
− | <head class="no-skrollr">
| |
− | <meta charset="utf-8">
| |
− | <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
| |
− | <title>ShanghaiTech University</title>
| |
− | <link rel="stylesheet" href="css/main2.css" />
| |
− | <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
| |
− | <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
| |
− | <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
| |
− | </head>
| |
− | <div id="p_1" class="content">
| |
− | <div class="row">
| |
− | 具体内容
| |
− | </div>
| |
− | </div>
| |
− |
| |
− | <div id="p_2" class="content">
| |
− | <div class="row">
| |
− | 具体内容
| |
− | </div>
| |
− | </div>
| |