Team:WHU-China/Safety

From 2012.igem.org

(Difference between revisions)
Line 1: Line 1:
<html>
<html>
-
<body>
+
  <body>
-
<style type="text/css">
+
    <style type="text/css">
-
/*
+
* {
-
* base css, DO NOT MODIFY!
+
  margin:0;
-
*/
+
  padding:0;
-
*{
+
  border:0;
-
margin: 0;
+
  font-family:"Verdana",sans-serif;
-
padding: 0;
+
  color:#333;
-
border: 0;
+
  outline:none;
-
font-family: "Verdana",sans-serif;
+
  resize:none;
-
color: #333;
+
-
outline: none;
+
-
resize: none;
+
}
}
-
html{
+
html {
-
overflow-y: scroll;
+
  overflow-y:scroll;
}
}
-
body{
+
body {
-
background: url("https://static.igem.org/mediawiki/2012/2/22/Body-bg.jpg") center top fixed;
+
  background:url("https://static.igem.org/mediawiki/2012/2/22/Body-bg.jpg")
 +
      center top fixed;
}
}
-
a{
+
a {
-
text-decoration: none;
+
  text-decoration:none;
}
}
-
.clear{
+
.clear {
-
width: 0;
+
  width:0;
-
height: 0;
+
  height:0;
-
line-height: 0;
+
  line-height:0;
-
display: block;
+
  display:block;
-
clear: both;
+
  clear:both;
}
}
-
 
+
div.whu-center {
-
/*
+
  width:940px;
-
* common css, include "header","footer"...
+
  margin:0 auto;
-
*/
+
-
div.whu-center{
+
-
width: 940px;
+
-
margin: 0 auto;
+
}
}
-
div.header{
+
div.header {
-
width: 940px;
+
  width:940px;
-
height: 357px;
+
  height:357px;
-
background: url("https://static.igem.org/mediawiki/2012/1/12/Header-bg.png") no-repeat;
+
  background:url("https://static.igem.org/mediawiki/2012/1/12/Header-bg.png")
-
position: relative;
+
      no-repeat;
-
z-index: 50;
+
  position:relative;
 +
  z-index:50;
}
}
-
div.nav{
+
div.nav {
-
position: absolute;
+
  position:absolute;
-
height: 80px;
+
  height:80px;
-
top: 206px;
+
  top:206px;
-
left: 350px;
+
  left:350px;
}
}
-
ul.nav-outerUl{
+
ul.nav-outerUl {
-
margin: 0;
+
  margin:0;
-
list-style: none;
+
  list-style:none;
}
}
-
li.nav-outerLi{
+
li.nav-outerLi {
-
display: block;
+
  display:block;
-
float: left;
+
  float:left;
-
width: 80px;
+
  width:80px;
-
height: 80px;
+
  height:80px;
-
margin: 0 6px;
+
  margin:0 6px;
-
background: url("https://static.igem.org/mediawiki/2012/9/91/Nav-tabs.png") no-repeat;
+
  background:url("https://static.igem.org/mediawiki/2012/9/91/Nav-tabs.png")
-
cursor: pointer;
+
      no-repeat;
 +
  cursor:pointer;
}
}
-
li.nav-outerLi1{
+
li.nav-outerLi1 {
-
background-position: 0 0;
+
  background-position:0 0;
}
}
-
li.nav-outerLi2{
+
li.nav-outerLi2 {
-
background-position: -80px 0;
+
  background-position:-80px 0;
}
}
-
li.nav-outerLi3{
+
li.nav-outerLi3 {
-
background-position: -160px 0;
+
  background-position:-160px 0;
}
}
-
li.nav-outerLi4{
+
li.nav-outerLi4 {
-
background-position: -240px 0;
+
  background-position:-240px 0;
}
}
-
li.nav-outerLi5{
+
li.nav-outerLi5 {
-
background-position: -320px 0;
+
  background-position:-320px 0;
}
}
-
li.nav-outerLi6{
+
li.nav-outerLi6 {
-
background-position: -400px 0;
+
  background-position:-400px 0;
}
}
-
li.nav-outerLi1:hover{
+
li.nav-outerLi1:hover {
-
background-position: 0 -80px;
+
  background-position:0 -80px;
}
}
-
li.nav-outerLi2:hover{
+
li.nav-outerLi2:hover {
-
background-position: -80px -80px;
+
  background-position:-80px -80px;
}
}
-
li.nav-outerLi3:hover{
+
li.nav-outerLi3:hover {
-
background-position: -160px -80px;
+
  background-position:-160px -80px;
}
}
-
li.nav-outerLi4:hover{
+
li.nav-outerLi4:hover {
-
background-position: -240px -80px;
+
  background-position:-240px -80px;
}
}
-
li.nav-outerLi5:hover{
+
li.nav-outerLi5:hover {
-
background-position: -320px -80px;
+
  background-position:-320px -80px;
}
}
-
li.nav-outerLi6:hover{
+
li.nav-outerLi6:hover {
-
background-position: -400px -80px;
+
  background-position:-400px -80px;
}
}
-
img.nav-bg-logo{
+
img.nav-bg-logo {
-
position: absolute;
+
  position:absolute;
-
z-index: 100;
+
  z-index:100;
}
}
-
div.middle{
+
div.middle {
-
width: 940px;
+
  width:940px;
-
background: #e6deb8;
+
  background:#e6deb8;
-
background: rgba(230,222,184,0.5);
+
  background:rgba(230,222,184,0.5);
-
position: absolute;
+
  position:absolute;
-
top: 178px;
+
  top:178px;
}
}
-
div.aside{
+
div.aside {
-
width: 174px;
+
  width:174px;
-
height: 441px;
+
  height:441px;
-
background: url("https://static.igem.org/mediawiki/2012/b/b3/Aside-bg.png") no-repeat;
+
  background:url("https://static.igem.org/mediawiki/2012/b/b3/Aside-bg.png")
-
margin-left: 10px;
+
      no-repeat;
-
float: left;
+
  margin-left:10px;
-
padding: 179px 86px 0 40px;
+
  float:left;
 +
  padding:179px 86px 0 40px;
}
}
-
div.asideFixed{
+
div.asideFixed {
-
position: fixed;
+
  position:fixed;
-
top: 0;
+
  top:0;
}
}
-
ul.aside-outerUl{
+
ul.aside-outerUl {
-
position: relative;
+
  position:relative;
-
top: 0;
+
  top:0;
-
margin: 10px 15px;
+
  margin:10px 15px;
-
list-style: none;
+
  list-style:none;
}
}
-
li.aside-outerLi{
+
li.aside-outerLi {
-
margin: 15px 0;
+
  margin:15px 0;
}
}
-
li.aside-outerLi h2{
+
li.aside-outerLi h2 {
-
background: #fff1a9;
+
  background:#fff1a9;
-
padding: 5px 10px;
+
  padding:5px
-
color: #725718;
+
      10px;
-
font-size: 22px;
+
  color:#725718;
-
line-height: 33px;
+
  font-size:22px;
-
font-weight: bold;
+
  line-height:33px;
-
text-align: center;
+
  font-weight:bold;
 +
  text-align:center;
}
}
-
ul.aside-innerUl{
+
ul.aside-innerUl {
-
list-style: none;
+
  list-style:none;
-
margin: 0;
+
  margin:0;
}
}
-
li.aside-innerLi{
+
li.aside-innerLi {
-
background: #e1cfbd;
+
  background:#e1cfbd;
-
padding: 5px 10px;
+
  padding:5px 10px;
-
color: #725718;
+
  color:#725718;
-
font-size: 18px;
+
  font-size:18px;
-
line-height: 27px;
+
  line-height:27px;
-
text-align: center;
+
  text-align:center;
-
margin: 0;
+
  margin:0;
}
}
-
div.main{
+
div.main {
-
width: 580px;
+
  width:580px;
-
border: 1px solid #9e8366;
+
  border:1px solid #9e8366;
-
background: #f0e2c1;
+
  background:#f0e2c1;
-
float: right;
+
  float:right;
-
margin: 149px 30px 30px 0;
+
  margin:149px 30px 30px 0;
}
}
-
div.passage{
+
div.passage {
-
margin: 30px;
+
  margin:30px;
-
clear: both;
+
  clear:both;
}
}
-
div.passage h3{
+
div.passage h3 {
-
font-size: 26px;
+
  font-size:26px;
-
line-height: 39px;
+
  line-height:39px;
-
font-weight: bold;
+
  font-weight:bold;
-
background: #859f93;
+
  background:#859f93;
-
color: #f0e2c1;
+
  color:#f0e2c1;
-
display: block;
+
  display:block;
-
width: auto;
+
  width:auto;
-
padding: 0 10px;
+
  padding:0 10px;
}
}
-
div.passage p{
+
div.passage p {
-
margin: 14px 0;
+
  margin:14px 0;
-
font-size: 13px;
+
  font-size:13px;
-
line-height: 20px;
+
  line-height:20px;
}
}
-
div.passage img{
+
div.passage img {
-
display: block;
+
  display:block;
-
float: right;
+
  float:right;
-
padding: 0 0 20px 30px;
+
  padding:0 0 20px
-
background: #f0e2c1;
+
      30px;
 +
  background:#f0e2c1;
}
}
-
div.footer{
+
div.footer {
 +
  }#p-logo {
 +
  display:none;
}
}
-
#p-logo{
+
#top-section {
-
display: none;
+
  height:0;
 +
  border:none;
}
}
-
#top-section{
+
#search-controls {
-
height: 0;
+
  display:none;
-
border: none;
+
-
}
+
-
#search-controls{
+
-
display: none;
+
}
}
#content {
#content {
-
position: inherit;
+
  position:inherit;
-
width: inherit;
+
  width:inherit;
-
margin: 0;
+
  margin:0;
-
padding: 0;
+
  padding:0;
-
background: inherit;
+
  background:inherit;
-
color: inherit;
+
  color:inherit;
-
border: none;
+
  border:none;
-
line-height: inherit;
+
  line-height:inherit;
-
z-index: 2;
+
  z-index:2;
}
}
-
.firstHeading{
+
.firstHeading {
-
display: none;
+
  display:none;
}
}
-
#catlinks{
+
#catlinks {
-
display: none;
+
  display:none;
}
}
-
#footer-box{
+
#footer-box {
-
display: none;
+
  display:none;
}
}
-
#contentSub{
+
#contentSub {
-
display: none;
+
  display:none;
}
}
-
#menubar ul li a{
+
#menubar ul li a {
-
background: none;
+
  background:none;
}
}
-
#bodyContent h1, #bodyContent h2{
+
#bodyContent h1,#bodyContent h2 {
-
margin: 0;
+
  margin:0;
-
border: 0;
+
  border:0;
}
}
-
.left-menu:hover{
+
.left-menu:hover {
-
background: none;
+
  background:none;
}
}
-
</style>
+
    </style>
-
<div class="whu-center">
+
    <div class="whu-center">
-
<div class="header">
+
      <div class="header">
-
<img class="nav-bg-logo" src="https://static.igem.org/mediawiki/2012/c/cc/Nav-bg-logo.png" />
+
        <img class="nav-bg-logo" src="https://static.igem.org/mediawiki/2012/c/cc/Nav-bg-logo.png"
-
<div class="nav">
+
        />
-
<ul class="nav-outerUl">
+
        <div class="nav">
-
<li class="nav-outerLi nav-outerLi1" title="Home">
+
          <ul class="nav-outerUl">
-
</li>
+
            <li class="nav-outerLi nav-outerLi1" title="Home">
-
<li class="nav-outerLi nav-outerLi2" title="Team">
+
            </li>
-
</li>
+
            <li class="nav-outerLi nav-outerLi2" title="Team">
-
<li class="nav-outerLi nav-outerLi3" title="Project">
+
            </li>
-
</li>
+
            <li class="nav-outerLi nav-outerLi3" title="Project">
-
<li class="nav-outerLi nav-outerLi4" title="Standard">
+
            </li>
-
</li>
+
            <li class="nav-outerLi nav-outerLi4" title="Standard">
-
<li class="nav-outerLi nav-outerLi5" title="Notes">
+
            </li>
-
</li>
+
            <li class="nav-outerLi nav-outerLi5" title="Notes">
-
<li class="nav-outerLi nav-outerLi6" title="Human Practice">
+
            </li>
-
</li>
+
            <li class="nav-outerLi nav-outerLi6" title="Human Practice">
-
</ul>
+
            </li>
-
</div>
+
          </ul>
-
</div>
+
        </div>
-
<div class="middle">
+
      </div>
-
<div class="aside">
+
      <div class="middle">
-
<ul class="aside-outerUl">
+
        <div class="aside">
-
<li class="aside-outerLi">
+
          <ul class="aside-outerUl">
-
<h2>Home</h2>
+
            <li class="aside-outerLi">
-
</li>
+
              <h2>
-
<li class="aside-outerLi">
+
                Home
-
<h2>Team</h2>
+
              </h2>
-
</li>
+
            </li>
-
<li class="aside-outerLi">
+
            <li class="aside-outerLi">
-
<h2>Project</h2>
+
              <h2>
-
<ul class="aside-innerUl">
+
                Team
-
<li class="aside-innerLi">safety</li>
+
              </h2>
-
</ul>
+
            </li>
-
</li>
+
            <li class="aside-outerLi">
-
<li class="aside-outerLi">
+
              <h2>
-
<h2>Standard</h2>
+
                Project
-
</li>
+
              </h2>
-
<li class="aside-outerLi">
+
              <ul class="aside-innerUl">
-
<h2>Notes</h2>
+
                <li class="aside-innerLi">
-
</li>
+
                  safety
-
<li class="aside-outerLi">
+
                </li>
-
<h2>Human Practice</h2>
+
              </ul>
-
</li>
+
            </li>
-
</ul>
+
            <li class="aside-outerLi">
-
</div>
+
              <h2>
-
<div class="main">
+
                Standard
-
<div class="passage">
+
              </h2>
-
<h3>这是标题</h3>
+
            </li>
-
<p>这是一段passage</p>
+
            <li class="aside-outerLi">
-
</div><div class="passage">
+
              <h2>
-
<h3>这是第二篇</h3>
+
                Notes
-
<p>这是一段passage，后面是换行<br />这是新的一行<br />这是第二行</p>
+
              </h2>
-
<p>这是二段passage</p>
+
            </li>
-
</div><div class="passage">
+
            <li class="aside-outerLi">
-
<h3>这是第三篇</h3>
+
              <h2>
-
<p>这是一段passage，后面是强调的<strong>这是强调的样式</strong></p>
+
                Human Practice
-
<p>这是一张图片
+
              </h2>
-
<img src="http://rp1.monday.vip.tw1.yahoo.net/res/gdsale/st_pic/1730/st-1730218-s100.jpg" />
+
            </li>
-
</p><p>这是图片的描述，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段</p>
+
          </ul>
-
</div><div class="passage">
+
        </div>
-
<h3>这是第四篇</h3>
+
        <div class="main">
-
<p>下面是list列表：<ul>
+
          <div class="passage">
-
<li>这是第一项</li><li>这是第二项</li><li>这是第三项</li></ul></p>
+
            <h3>
-
</div>
+
              这是标题
-
</div>
+
            </h3>
-
<div class="clear"></div>
+
            <p>
-
</div>
+
              这是一段passage
-
<div class="footer">
+
            </p>
-
</div>
+
          </div>
-
</div>
+
          <div class="passage">
-
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
+
            <h3>
-
<script>
+
              这是第二篇
-
$(function(){
+
            </h3>
-
//when scrolling, the "aside" div will be fixed
+
            <p>
-
$(window).scroll(function(){
+
              这是一段passage，后面是换行
-
if($(window).scrollTop()>179){
+
              <br />
-
$('div.aside').addClass('asideFixed');
+
              这是新的一行
-
$('ul.aside-outerUl').css('top', function(){
+
              <br />
-
return (Math.max(179 - $(window).scrollTop(), -179) + 'px');
+
              这是第二行
-
});
+
            </p>
-
}else{
+
            <p>
-
$('div.aside').removeClass('asideFixed');
+
              这是二段passage
-
$('ul.aside-outerUl').css('top', '0');
+
            </p>
-
}
+
          </div>
-
});
+
          <div class="passage">
-
//show nav
+
            <h3>
-
$('#bodyContent').children('p:first').hide();
+
              这是第三篇
-
});
+
            </h3>
-
</script>
+
            <p>
-
</body>
+
              这是一段passage，后面是强调的
 +
              <strong>
 +
                这是强调的样式
 +
              </strong>
 +
            </p>
 +
            <p>
 +
              这是一张图片
 +
              <img src="http://rp1.monday.vip.tw1.yahoo.net/res/gdsale/st_pic/1730/st-1730218-s100.jpg"
 +
              />
 +
            </p>
 +
            <p>
 +
              这是图片的描述，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段
 +
            </p>
 +
          </div>
 +
          <div class="passage">
 +
            <h3>
 +
              这是第四篇
 +
            </h3>
 +
            <p>
 +
              下面是list列表：
 +
              <ul>
 +
                <li>
 +
                  这是第一项
 +
                </li>
 +
                <li>
 +
                  这是第二项
 +
                </li>
 +
                <li>
 +
                  这是第三项
 +
                </li>
 +
              </ul>
 +
            </p>
 +
          </div>
 +
        </div>
 +
        <div class="clear">
 +
        </div>
 +
      </div>
 +
      <div class="footer">
 +
      </div>
 +
    </div>
 +
    <script src="http://code.jquery.com/jquery-1.7.2.min.js">
 +
    </script>
 +
    <script>
 +
      $(function() {
 +
        //when scrolling, the "aside" div will be fixed
 +
        $(window).scroll(function() {
 +
          if ($(window).scrollTop() > 179) {
 +
            $('div.aside').addClass('asideFixed');
 +
            $('ul.aside-outerUl').css('top',
 +
            function() {
 +
              return (Math.max(179 - $(window).scrollTop(), -179) + 'px');
 +
            });
 +
          } else {
 +
            $('div.aside').removeClass('asideFixed');
 +
            $('ul.aside-outerUl').css('top', '0');
 +
          }
 +
        });
 +
        //show nav
 +
        $('#bodyContent').children('p:first').hide();
 +
      });
 +
    </script>
 +
  </body>
</html>
</html>

Revision as of 07:33, 5 September 2012

  • Home

  • Team

  • Project

    • safety

  • Standard

  • Notes

  • Human Practice

这是标题

这是一段passage

这是第二篇

这是一段passage，后面是换行
这是新的一行
这是第二行

这是二段passage

这是第三篇

这是一段passage，后面是强调的 这是强调的样式

这是一张图片

这是图片的描述，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段，这是下一段

这是第四篇

下面是list列表：

  • 这是第一项
  • 这是第二项
  • 这是第三项

Retrieved from "http://2012.igem.org/Team:WHU-China/Safety"