Difference between revisions of "Team:ZJU-China/Model/Coculture"

(Created page with "<html lang="zh-CN"> <head> <!-- Meta, title, CSS, favicons, etc. --> <!-- Bootstrap core CSS --> <!-- <link href="css/bootstrap.css" rel="stylesheet"> --> <!-...")
 
Line 1: Line 1:
 +
 
<html lang="zh-CN">
 
<html lang="zh-CN">
−
<head>
+
  <head>
−
    <!-- Meta, title, CSS, favicons, etc. -->
+
−
    <!-- Bootstrap core CSS -->
+
  
−
    <!-- <link href="css/bootstrap.css" rel="stylesheet"> -->
 
−
    <!-- <link href='css/bootstrap.css' rel='stylesheet' type='text/css'> -->
 
−
    <link href="https://2017.igem.org/Zju/css/bootstrap?action=raw&ctype=text/css" rel="stylesheet" media="screen"/>
 
−
    <!-- Optional Bootstrap Theme -->
 
  
 +
<link href="https://2017.igem.org/Zju/css/bootstrap?action=raw&ctype=text/css" rel="stylesheet" media="screen" />
 +
<link href="https://2017.igem.org/Zju/css/bootstraptheme?action=raw&ctype=text/css" rel="stylesheet" id="bs-theme-stylesheet">
 +
<link href='https://2017.igem.org/Team:ZJU-China/cs/font?action=raw&ctype=text/css' rel='stylesheet' type='text/css'>
 +
<link href="https://2017.igem.org/Zju/css/docs/min?action=raw&ctype=text/css" rel="stylesheet" type="text/css"/>
 +
<link href="https://2017.igem.org/Zju/css/doc-style?action=raw&ctype=text/css" rel="stylesheet">
 +
<link href="https://2017.igem.org/Zju/css/responsive/min?action=raw&ctype=text/css" rel="stylesheet">
  
−
    <!-- <link href="css/bootstrap-theme.css" rel="stylesheet" id="bs-theme-stylesheet"> -->
+
<script>
−
    <link href="https://2017.igem.org/Zju/css/bootstraptheme?action=raw&ctype=text/css" rel="stylesheet"
+
  var _hmt = _hmt || [];
−
          id="bs-theme-stylesheet">
+
</script>
 +
  </head>
  
−
    <!-- 按钮的字体 -->
 
−
    <link href='https://2017.igem.org/Team:ZJU-China/cs/font?action=raw&ctype=text/css' rel='stylesheet' type='text/css'>
 
−
    <!-- 按钮的字体end -->
 
  
−
    <!-- Documentation extras -->
+
<style>
 +
/*Override default CSS*/
 +
#sideMenu, #top_title {display:none;}
 +
#content { padding:0px; width:100%; margin-top:-7px; margin-left:0px;background-color: transparent;}
  
−
    <link href="https://2017.igem.org/Zju/css/docs/min?action=raw&ctype=text/css" rel="stylesheet" type="text/css"/>
 
  
−
    <!-- <link href="css/doc-style.css" rel="stylesheet" type="text/css"/> -->
+
/* set all basic objects to neutral formatting*/
−
     <link href="https://2017.igem.org/Zju/css/doc-style?action=raw&ctype=text/css" rel="stylesheet">
+
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption {
−
     <link href="https://2017.igem.org/Zju/css/responsive/min?action=raw&ctype=text/css" rel="stylesheet">
+
     margin: 0;
 +
    padding: 0;
 +
    border: 0;
 +
    outline: 0;
 +
    font-size: 100%;
 +
     vertical-align: baseline;
 +
    background: transparent;
 +
}
  
−
     <script>
+
#globalWrapper {
−
        var _hmt = _hmt || [];
+
     margin: 0;
−
     </script>
+
    padding: 0;
−
</head>
+
     border: 0;
 +
    outline: 0;
 +
    font-size: 100%;
 +
    vertical-align: baseline;
 +
    background: transparent;
 +
}
  
  
−
<style>
+
/* set page to fill window*/
−
    /*Override default CSS*/
+
html{
−
    #sideMenu, #top_title {
+
  height: 100%;
−
        display: none;
+
}
−
    }
+
body {
 +
  min-height: 100%;
 +
  background-color: #FFFFFF;  
 +
}
  
−
    #content {
 
−
        padding: 0px;
 
−
        width: 100%;
 
−
        margin-top: -7px;
 
−
        margin-left: 0px;
 
−
        background-color: transparent;
 
−
    }
 
  
−
    /* set all basic objects to neutral formatting*/
+
#content_wrapper {
−
     html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption {
+
     position: relative;
−
        margin: 0;
+
  top: 0px;
−
        padding: 0;
+
  left: 0px;
−
        border: 0;
+
  margin: 0px;
−
        outline: 0;
+
    width: 100%;  
−
        font-size: 100%;
+
    height: 100%;  
−
        vertical-align: baseline;
+
  text-align:center;
−
        background: transparent;
+
    background-color: #FFFFFF;
−
    }
+
}
  
−
    #globalWrapper {
+
#content_wrapper p {
−
        margin: 0;
+
    font-family: 'Tempus Sans ITC',Tahoma, Geneva, sans-serif;
−
        padding: 0;
+
}
−
        border: 0;
+
−
        outline: 0;
+
−
        font-size: 100%;
+
−
        vertical-align: baseline;
+
−
        background: transparent;
+
−
    }
+
  
−
    /* set page to fill window*/
+
#content_wrapper a {
−
     html {
+
     color:#004789;
−
        height: 100%;
+
}
−
    }
+
  
−
    body {
 
−
        min-height: 100%;
 
−
        background-color: #FFFFFF;
 
−
    }
 
  
−
    #content_wrapper {
+
#footer {  
−
        position: relative;
+
    position:absolute;  
−
        top: 0px;
+
    bottom: 0px;
−
        left: 0px;
+
    left: 0px;
−
        margin: 0px;
+
    width: 100%;
−
        width: 100%;
+
    margin-top: 0px;
−
        height: 100%;
+
    margin-bottom: 20px;
−
        text-align: center;
+
    background-color: #FFFFFF;
−
        background-color: #FFFFFF;
+
     text-align: center;
−
     }
+
}
  
−
    #content_wrapper p {
+
.center {  
−
        font-family: 'Yanone Kaffeesatz', Tahoma, Geneva, sans-serif;
+
  width: 60%;
−
     }
+
    margin-top: 16px;
 +
  min-width: 500px;
 +
     padding-bottom:32px;
 +
  display: inline-block;       
 +
}
  
−
    #content_wrapper a {
+
.TextContent {
−
        color: #004789;
+
  text-align: left;
−
    }
+
  vertical-align: baseline;
 +
  font-size: 0.875em;
 +
  font-family:'Tempus Sans ITC', verdana, sans-serif;
 +
}
  
−
    #footer {
+
.TextContent h1{  
−
        position: absolute;
+
  text-align: center;
−
        bottom: 0px;
+
  font-size: 1.5rem;
−
        left: 0px;
+
  margin-bottom: 1em;
−
        width: 100%;
+
  margin-top: 0.2em;
−
        margin-top: 0px;
+
  color: #3399ff;
−
        margin-bottom: 20px;
+
  font-family:'Tempus Sans ITC', verdana, sans-serif;
−
        background-color: #FFFFFF;
+
}
−
        text-align: center;
+
−
    }
+
  
−
    .center {
+
.TextContent h2{
−
        width: 60%;
+
  line-height: 1.6;
−
        margin-top: 16px;
+
  margin-bottom: 0em;
−
        min-width: 500px;
+
  margin-top: 1em;
−
        padding-bottom: 32px;
+
  text-align: left;
−
        display: inline-block;
+
  font-family:'Tempus Sans ITC', verdana, sans-serif;
−
    }
+
}
  
−
    .TextContent {
+
.TextContent p{
−
        text-align: left;
+
  margin-bottom: 1.2em;
−
        vertical-align: baseline;
+
  font-family:'Tempus Sans ITC', verdana, sans-serif;
−
        font-size: 0.875em;
+
}
−
        font-family: 'Yanone Kaffeesatz', verdana, sans-serif;
+
−
    }
+
  
−
    .TextContent h1 {
+
.Page_Wide {
−
        text-align: center;
+
  width:100%;  
−
        font-size: 1.5rem;
+
}
−
        margin-bottom: 1em;
+
−
        margin-top: 0.2em;
+
−
        color: #3399ff;
+
−
        font-family: 'Yanone Kaffeesatz', verdana, sans-serif;
+
−
    }
+
  
−
    .TextContent h2 {
+
.Quarter_Image {
−
        line-height: 1.6;
+
  width:25%;
−
        margin-bottom: 0em;
+
  max-height:250px;
−
        margin-top: 1em;
+
  float:left;
−
        text-align: left;
+
}
−
        font-family: 'Yanone Kaffeesatz', verdana, sans-serif;
+
−
    }
+
  
−
    .TextContent p {
+
.Quarter_Image img {
−
        margin-bottom: 1.2em;
+
    display:block;
−
        font-family: 'Yanone Kaffeesatz', verdana, sans-serif;
+
    margin:auto;
−
     }
+
    max-height: 250px;
 +
     width: auto;
 +
}
  
−
    .Page_Wide {
+
.SocialMediaIconWrapper {
−
        width: 100%;
+
    width:100%;
−
    }
+
}
  
−
    .Quarter_Image {
+
.SocialMediaIcon {
−
        width: 25%;
+
    width:4%;
−
        max-height: 250px;
+
    height:auto;
−
        float: left;
+
    margin-left:20px;
−
     }
+
     display: inline-block;
 +
    float:left;
  
−
    .Quarter_Image img {
+
}
−
        display: block;
+
−
        margin: auto;
+
−
        max-height: 250px;
+
−
        width: auto;
+
−
    }
+
  
−
    .SocialMediaIconWrapper {
+
.SocialMediaIcon img{
−
        width: 100%;
+
    max-width:100%;
−
    }
+
  height:auto
 +
}
  
−
    .SocialMediaIcon {
+
.TeamImage {
−
        width: 4%;
+
  width:100%;  
−
        height: auto;
+
}
−
        margin-left: 20px;
+
−
        display: inline-block;
+
−
        float: left;
+
  
−
     }
+
.TeamImage img { 
 +
     max-width:100%;
 +
  height:auto
 +
}
  
−
    .SocialMediaIcon img {
+
.sponsors {
−
        max-width: 100%;
+
  width: 100%;
−
        height: auto
+
}
−
    }
+
  
−
    .TeamImage {
+
.sponsor_row {  
−
        width: 100%;
+
  width: 100%;
−
    }
+
}
  
−
    .TeamImage img {
+
.sponsor_img {  
−
        max-width: 100%;
+
  width: 16.6666667%;  
−
        height: auto
+
  float:left;   
−
    }
+
}
  
−
    .sponsors {
+
.sponsor_img img{  
−
        width: 100%;
+
  max-width:100%;
−
    }
+
  height:auto
 +
}
  
−
    .sponsor_row {
+
.clear {
−
        width: 100%;
+
    clear:both;
−
    }
+
}
  
−
    .sponsor_img {
+
.clear.extra_space {
−
        width: 16.6666667%;
+
    height: 20px;
−
        float: left;
+
}
−
    }
+
  
−
    .sponsor_img img {
+
.line_divider {
−
        max-width: 100%;
+
    border-top: 1px solid #d3d3d3;
−
        height: auto
+
    width: 98%;
−
    }
+
    margin: auto;
 +
}
  
−
    .clear {
+
.copyright{
−
        clear: both;
+
  color: #888888;
−
    }
+
  font-size: 13px;
 +
  text-align: center !important;
 +
}
  
−
    .clear.extra_space {
 
−
        height: 20px;
 
−
    }
 
  
−
    .line_divider {
+
.copyright a{
−
        border-top: 1px solid #d3d3d3;
+
  color: #d2ebe3;
−
        width: 98%;
+
  border-bottom: dotted 1px #a5d8c7;
−
        margin: auto;
+
}
−
    }
+
  
−
    .copyright {
+
.PP {
−
        color: #888888;
+
    font-family: georgia;
−
        font-size: 13px;
+
    font-size: 20px;
−
        text-align: center !important;
+
    font-weight: 100;
−
    }
+
    text-align: left;
 +
}
  
−
    .copyright a {
+
/*文中自定义*/
−
        color: #d2ebe3;
+
.CuteButton:active {
−
        border-bottom: dotted 1px #a5d8c7;
+
    -webkit-box-shadow: 0px 3px 0px rgba(0,52,63,1), 0px 3px 6px rgba(0,0,0,.9);
−
     }
+
    -moz-box-shadow: 0px 3px 0px rgba(0,52,63,1), 0px 3px 6px rgba(0,0,0,.9);
 +
     box-shadow: 0px 3px 0px rgba(0,52,63,1), 0px 3px 6px rgba(0,0,0,.9);
 +
    position: relative;
 +
    top: 6px;
 +
}  
  
−
    .PP {
+
.YellowCB {
−
        font-family: georgia;
+
    background-color: rgba(254,196,62,1);
−
        font-size: 20px;
+
    -webkit-box-shadow: 0px 9px 0px rgba(245,253,202,1), 0px 9px 25px rgba(0,0,0,.7);
−
        font-weight: 100;
+
    -moz-box-shadow: 0px 9px 0px rgba(245,253,202,1), 0px 9px 25px rgba(0,0,0,.7);
−
        text-align: left;
+
    box-shadow: 0px 9px 0px rgba(245,253,202,1), 0px 9px 25px rgba(0,0,0,.7);
−
    }
+
}
  
−
    /*文中自定义*/
+
.GreenCB {
−
    .CuteButton:active {
+
    background-color: rgba(25,148,117,1);
−
        color:white !important;
+
    -webkit-box-shadow: 0px 9px 0px rgba(4,77,34,1), 0px 9px 25px rgba(0,0,0,.7);
−
        -webkit-box-shadow: 0px 3px 0px rgba(0,52,63,1), 0px 3px 6px rgba(0,0,0,.9);
+
    -moz-box-shadow: 0px 9px 0px rgba(4,77,34,1), 0px 9px 25px rgba(0,0,0,.7);
−
        -moz-box-shadow: 0px 3px 0px rgba(0,52,63,1), 0px 3px 6px rgba(0,0,0,.9);
+
    box-shadow: 0px 9px 0px rgba(4,77,34,1), 0px 9px 25px rgba(0,0,0,.7);
−
        box-shadow: 0px 3px 0px rgba(0,52,63,1), 0px 3px 6px rgba(0,0,0,.9);
+
}
−
        position: relative;
+
−
        top: 6px;
+
−
    }
+
  
−
    .CuteButton:visited {
+
.SmallCB {
−
        color:white !important;
+
    font-size: 1.5em;
−
        -webkit-box-shadow: 0px 3px 0px rgba(0,52,63,1), 0px 3px 6px rgba(0,0,0,.9);
+
    margin-left: 2px;
−
        -moz-box-shadow: 0px 3px 0px rgba(0,52,63,1), 0px 3px 6px rgba(0,0,0,.9);
+
    padding: 2px 10px ;
−
        box-shadow: 0px 3px 0px rgba(0,52,63,1), 0px 3px 6px rgba(0,0,0,.9);
+
    width: 100px;
−
        position: relative;
+
}
−
        top: 6px;
+
−
    }
+
  
−
    .YellowCB {
 
−
        background-color: rgba(254, 196, 62, 1);
 
−
        -webkit-box-shadow: 0px 9px 0px rgba(245, 253, 202, 1), 0px 9px 25px rgba(0, 0, 0, .7);
 
−
        -moz-box-shadow: 0px 9px 0px rgba(245, 253, 202, 1), 0px 9px 25px rgba(0, 0, 0, .7);
 
−
        box-shadow: 0px 9px 0px rgba(245, 253, 202, 1), 0px 9px 25px rgba(0, 0, 0, .7);
 
−
    }
 
  
−
    .GreenCB {
+
.ArticleHead{
−
        background-color: rgba(25, 148, 117, 1);
+
  font-family: 'Tempus Sans ITC',georgia !important;
−
        -webkit-box-shadow: 0px 9px 0px rgba(4, 77, 34, 1), 0px 9px 25px rgba(0, 0, 0, .7);
+
  font-size: 40px !important;
−
        -moz-box-shadow: 0px 9px 0px rgba(4, 77, 34, 1), 0px 9px 25px rgba(0, 0, 0, .7);
+
  font-weight: 800 !important;
−
        box-shadow: 0px 9px 0px rgba(4, 77, 34, 1), 0px 9px 25px rgba(0, 0, 0, .7);
+
  color: #56A36C !important;
−
    }
+
  text-align: center !important;
 +
    margin-bottom: 0 !important;
 +
    /*margin-top: .6em !important;*/
 +
}
  
−
    .SmallCB {
+
.H3Head{
−
        font-size: 1.5em;
+
  font-family: 'Tempus Sans ITC',georgia !important;
−
        margin-left: 2px;
+
  color: #FEC43E !important;
−
        padding: 2px 10px;
+
  font-size: 25px !important;
−
        width: 100px;
+
  font-weight: 400 !important;
−
     }
+
  text-align: left !important;
 +
    margin-bottom: 0 !important;
 +
     margin-top:.6em !important;
 +
}
  
 +
.PP{
 +
  font-family:Tahoma, Geneva, sans-serif !important;
 +
  font-size: 20px !important;
 +
  font-weight: 100 !important;
 +
  text-align: left !important;
 +
}
  
  
−
    .ArticleHead{
+
.Retract{
−
        font-family: 'Tempus Sans ITC',georgia !important;
+
  padding-left: 50px;
−
        font-size: 40px !important;
+
}
−
        font-weight: 800 !important;
+
−
        color: #56A36C !important;
+
−
        text-align: center !important;
+
−
        margin-bottom: 0 !important;
+
−
        margin-top: .6em !important;
+
−
    }
+
  
−
    .H3Head{
+
.GreenAH{
−
        font-family: 'Tempus Sans ITC',georgia !important;
+
  color: #56A36C;
−
        color: #FEC43E !important;
+
}
−
        font-size: 25px !important;
+
−
        font-weight: 400 !important;
+
−
        text-align: left !important;
+
−
        margin-bottom: 0 !important;
+
−
        margin-top:.6em !important;
+
−
    }
+
  
−
    .PP{
+
.YellowAH{
−
        font-family:Tahoma, Geneva, sans-serif !important;
+
  color: #FEC43E;
−
        font-size: 20px !important;
+
}
−
        font-weight: 100 !important;
+
−
        text-align: left !important;
+
−
    }
+
  
 +
.contentLi{
 +
    margin:0;
 +
    font-size:17px;
 +
    line-height: 27px;
 +
    padding-bottom: 20px;
 +
    color: #111111;
 +
}
  
−
    .Retract{
+
.greyTable
−
        padding-left: 50px;
+
{
−
    }
+
  color: #7f7f7f;
 +
}
  
−
    .GreenAH{
+
.yellowTable
−
        color: #56A36C;
+
{
−
    }
+
  color: #CD9B1D;
 +
}
  
−
    .YellowAH{
+
h2{
−
        color: #FEC43E;
+
  font-family: 'Tempus Sans ITC';
−
    }
+
  font-weight: 500;
 +
  font-size: 35px;
 +
  text-align: left;
 +
}
  
−
    .contentLi{
+
h3{
−
        margin:0;
+
  font-family: 'Tempus Sans ITC';
−
        font-size:17px;
+
  font-weight: 500;
−
        line-height: 27px;
+
  font-size: 32px;
−
        padding-bottom: 20px;
+
  text-align: left;
−
        color: #111111;
+
}
−
    }
+
  
−
    .blueTable
+
h4{
−
    {
+
  font-family: 'Tempus Sans ITC';
−
        color: #1E90FF;
+
  font-weight: 500;
−
    }
+
  font-size: 28px;
 +
  text-align: left;
 +
}
  
−
    .yellowTable
+
h5{
−
    {
+
  font-family: 'Tempus Sans ITC';
−
        color: #CD9B1D;
+
  font-weight: 500;
−
    }
+
  font-size: 25px;
 +
  text-align: left;
 +
}
  
−
    h2{
+
p{
−
        font-family: 'Tempus Sans ITC';
+
  margin:0;
−
        font-weight: 500;
+
  font-size:17px;
−
        font-size: 35px;
+
  line-height: 30px;
−
        text-align: left;
+
  /*padding-bottom: 20px;*/
−
    }
+
  color: #111111;
 +
}
  
−
    h3{
+
.bs-docs-sidenav
−
        font-family: 'Tempus Sans ITC';
+
{
−
        font-weight: 500;
+
    font-family:Tahoma, Geneva, sans-serif !important;
−
        font-size: 32px;
+
    font-size: 20px !important;
−
        text-align: left;
+
    font-weight: 100 !important;
−
    }
+
    text-align: left !important;
 +
}
  
−
    h4{
 
−
        font-family: 'Tempus Sans ITC';
 
−
        font-weight: 500;
 
−
        font-size: 28px;
 
−
        text-align: left;
 
−
    }
 
  
−
    h5{
+
.textli li{
−
        font-family: 'Tempus Sans ITC';
+
    font-family:Tahoma, Geneva, sans-serif !important;
−
        font-weight: 500;
+
    font-size: 20px !important;
−
        font-size: 25px;
+
    font-weight: 100 !important;
−
        text-align: left;
+
    text-align: left !important;
−
    }
+
}
  
−
    p{
+
.nonStyleTable
−
        margin:0;
+
{
−
        font-size:17px;
+
    background: transparent !important;
−
        line-height: 30px;
+
    border:none !important;
−
        /*padding-bottom: 20px;*/
+
}
−
        color: #111111;
+
−
    }
+
  
−
    .bs-docs-sidenav
+
.textimg{
−
     {
+
     /*width:50%;*/
−
        font-family:Tahoma, Geneva, sans-serif !important;
+
    /*margin-top: 20px;*/
−
        font-size: 20px !important;
+
    /*padding-bottom: 20px;*/
−
        font-weight: 100 !important;
+
    text-align: center;
−
        text-align: left !important;
+
}
−
    }
+
  
  
−
    .textli li{
 
−
        font-family:Tahoma, Geneva, sans-serif !important;
 
−
        font-size: 20px !important;
 
−
        font-weight: 100 !important;
 
−
        text-align: left !important;
 
−
    }
 
  
−
    .codes
+
/*老姜要好看一点的表格*/
−
     {
+
.tableNice thead, .tableNice tr {
 +
     text-align: center;
 +
    border-top-width: 1px;
 +
    border-top-style: solid;
 +
    border-top-color: #b1c6d9;
 +
}
 +
.tableNice {
 +
    width: auto;
 +
    margin-left: 30%;
 +
    border-bottom-width: 1px;
 +
    border-bottom-style: solid;
 +
    border-bottom-color: #D0E9FF;
 +
}
  
−
        display: table;
+
/* Padding and font style */
−
        font-family:Consolas !important;
+
.tableNice td, .tableNice th {
−
        /*border: solid #E1E1E8 !important;*/
+
    padding: 5px 10px;
−
        /*background-color: #F7F7F9 !important;*/
+
    font-size: 12px;
−
        /*width:auto !important;*/
+
−
    }
+
  
−
     /*文中自定义*/
+
     color: #00343F;
−
</style>
+
}
  
−
<body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">
+
/* Alternating background colors */
−
<div class="page-loader"></div>
+
.tableNice tr:nth-child(even) {
−
<!-- Docs master nav -->
+
    background: transparent;
−
<!-- <h1><a class="navbar-brand" href="index.html">MuMei Lab</a></h1> -->
+
  
 +
}
 +
.tableNice tr:nth-child(odd) {
 +
    background: #EBFFFF;
 +
}
  
−
<div class="container">
+
.tableOuter
−
     <!-- header -->
+
{
−
     <div class="header-w3layouts">
+
     align: center;
−
        <!-- Navigation -->
+
     text-align: left;
−
        <nav class="navbar navbar-default navbar-fixed-top">
+
}
−
            <div class="navbar-header page-scroll">
+
−
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
+
−
                </button>
+
  
−
                <a href="https://2017.igem.org/Team:ZJU-China">
+
.ref
−
                    <img style="margin-top:11px" class="navbar-brand"  src="https://static.igem.org/mediawiki/2017/d/d5/ZJUChina_logo.png">
+
{
−
                </a>
+
    font-size: 16px !important;
 +
    line-height:22px !important;
 +
    margin-bottom: 5px !important;
 +
    color: #353535;
 +
}
 +
/*老姜要好看一点的表格止*/
 +
/*文中自定义*/
 +
</style>
  
−
                <!-- <h1><a class="navbar-brand" href="index.html">My Design</a></h1> -->
+
  <body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">
 +
  <div class="page-loader"></div>
 +
      <!-- Docs master nav -->
 +
                  <!-- <h1><a class="navbar-brand" href="index.html">MuMei Lab</a></h1> -->
  
−
            </div>
+
  <div class="container">
−
            <!-- Collect the nav links, forms, and other content for toggling -->
+
      <!-- header -->
−
            <div class="collapse navbar-collapse navbar-ex1-collapse">
+
      <div class="header-w3layouts">
−
                <ul class="nav navbar-nav navbar-right cl-effect-15">
+
          <!-- Navigation -->
−
                    <!-- Hidden li included to remove active class from about link when scrolled up past about section -->
+
          <nav class="navbar navbar-default navbar-fixed-top">
−
                    <li class="hidden"><a class="page-scroll" href="#page-top"></a> </li>
+
              <div class="navbar-header page-scroll">
 +
                  <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
 +
                  </button>
  
−
                    <li class="m_nav_item dropdown">
+
                  <a href="https://2017.igem.org/Team:ZJU-China">
−
                        <a href="#" class="dropdown-toggle link" data-toggle="dropdown">Overview<b class="caret"></b></a>
+
                      <img style="margin-top:11px" class="navbar-brand" src="https://static.igem.org/mediawiki/2017/d/d5/ZJUChina_logo.png">
−
                        <ul class="dropdown-menu ">
+
                  </a>
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Overview">Project Description</a></li>
+
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Achievements">Achievements</a></li>
+
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/InterLab">InterLab</a></li>
+
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/ImproveParts">Improve Parts</a></li>
+
−
                        </ul>
+
−
                    </li>
+
  
−
                    <li class="m_nav_item dropdown">
+
                  <!-- <h1><a class="navbar-brand" href="index.html">My Design</a></h1> -->
−
                        <a href="#" class="dropdown-toggle link" data-toggle="dropdown">Project<b class="caret"></b></a>
+
−
                        <ul class="dropdown-menu ">
+
−
                            <!--<li><a href="https://2017.igem.org/Team:ZJU-China/Project">Project Home</a></li>-->
+
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Project/tp">Trichoderma Proof</a></li>
+
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Project/voc">VOC sensors</a></li>
+
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Project/st">Signal Transduction</a></li>
+
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Project/ms">Mat Synthesis</a></li>
+
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Project/conclusion">Conclusion</a></li>
+
−
                            <!--<li><a href="https://2017.igem.org/Team:ZJU-China/Project/improvement">Improvement</a></li>-->
+
−
                            <!--<li><a href="https://2017.igem.org/Team:ZJU-China/InterLab">Interlab</a></li>-->
+
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Notebook">Notebook</a></li>
+
−
                        </ul>
+
−
                    </li>
+
  
−
                    <li class="m_nav_item dropdown" >
+
              </div>
−
                        <a href="#" class="dropdown-toggle link" data-toggle="dropdown">Modelling<b class="caret"></b></a>
+
              <!-- Collect the nav links, forms, and other content for toggling -->
−
                        <ul class="dropdown-menu ">
+
              <div class="collapse navbar-collapse navbar-ex1-collapse">
−
                            <!--<li><a href="https://2017.igem.org/Team:ZJU-China/Model">Summery</a></li>-->
+
                  <ul class="nav navbar-nav navbar-right cl-effect-15">
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Model">VOC analysis</a></li>
+
                      <!-- Hidden li included to remove active class from about link when scrolled up past about section -->
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Model/Coculture">Coculture</a></li>
+
                      <li class="hidden"><a class="page-scroll" href="#page-top"></a> </li>
  
−
                        </ul>
+
                      <li class="m_nav_item dropdown">
−
                    </li>
+
                          <a href="#" class="dropdown-toggle link" data-toggle="dropdown">Overview<b class="caret"></b></a>
 +
                          <ul class="dropdown-menu ">
 +
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Overview">Project Description</a></li>
 +
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Achievements">Achievements</a></li>
 +
                              <li><a href="https://2017.igem.org/Team:ZJU-China/InterLab">InterLab</a></li>
 +
                              <li><a href="https://2017.igem.org/Team:ZJU-China/ImproveParts">Improve Parts</a></li>
 +
                          </ul>
 +
                      </li>
  
−
                    <li class="m_nav_item dropdown">
+
                      <li class="m_nav_item dropdown">
−
                        <a href="#" class="dropdown-toggle link" data-toggle="dropdown">Parts<b class="caret"></b></a>
+
                          <a href="#" class="dropdown-toggle link" data-toggle="dropdown">Project<b class="caret"></b></a>
−
                        <ul class="dropdown-menu ">
+
                          <ul class="dropdown-menu ">
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Parts">All Parts</a></li>
+
                              <!--<li><a href="https://2017.igem.org/Team:ZJU-China/Project">Project Home</a></li>-->
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Parts/Basic">Basic Parts</a></li>
+
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Project/tp">Trichoderma Proof</a></li>
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Parts/Composite">Composite Parts</a></li>
+
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Project/voc">VOC sensors</a></li>
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Parts/Collection">Parts Collection</a></li>
+
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Project/st">Signal Transduction</a></li>
−
                        </ul>
+
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Project/Downstream">Downstream</a></li>
−
                    </li>
+
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Project/conclusion">Conclusion</a></li>
 +
                              <!--<li><a href="https://2017.igem.org/Team:ZJU-China/Project/improvement">Improvement</a></li>-->
 +
                              <!--<li><a href="https://2017.igem.org/Team:ZJU-China/InterLab">Interlab</a></li>-->
 +
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Notebook">Notebook</a></li>
 +
                          </ul>
 +
                      </li>
  
−
                    <li><a href="https://2017.igem.org/Team:ZJU-China/Hardware">Hardware</a></li>
+
                      <li class="m_nav_item dropdown" >
 +
                          <a href="#" class="dropdown-toggle link" data-toggle="dropdown">Modelling<b class="caret"></b></a>
 +
                          <ul class="dropdown-menu ">
 +
                              <!--<li><a href="https://2017.igem.org/Team:ZJU-China/Model">Summery</a></li>-->
 +
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Model">VOC analysis</a></li>
 +
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Model/Coculture">Coculture</a></li>
  
−
                    <li class="m_nav_item dropdown" >
+
                          </ul>
−
                        <a href="#" class="dropdown-toggle link" data-toggle="dropdown">Safety<b class="caret"></b></a>
+
                      </li>
−
                        <ul class="dropdown-menu ">
+
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Safety">Environment</a></li>
+
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Safety/Lab">Laboratory</a></li>
+
−
                        </ul>
+
−
                    </li>
+
  
−
                    <li><a href="https://2017.igem.org/Team:ZJU-China/HP/Collaborations">Collaborations</a></li>
+
                      <li class="m_nav_item dropdown">
 +
                          <a href="#" class="dropdown-toggle link" data-toggle="dropdown">Parts<b class="caret"></b></a>
 +
                          <ul class="dropdown-menu ">
 +
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Parts">All Parts</a></li>
 +
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Parts/Basic">Basic Parts</a></li>
 +
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Parts/Composite">Composite Parts</a></li>
 +
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Parts/Collection">Parts Collection</a></li>
 +
                          </ul>
 +
                      </li>
  
−
                    <li class="m_nav_item dropdown">
+
                      <li><a href="https://2017.igem.org/Team:ZJU-China/Hardware">Hardware</a></li>
−
                        <a href="#" class="dropdown-toggle link" data-toggle="dropdown">HP<b class="caret"></b></a>
+
−
                        <ul class="dropdown-menu ">
+
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Human_Practices">Summary</a></li>
+
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/HP/Silver">Silver</a></li>
+
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/HP/Gold_Integrated">Gold</a></li>
+
−
                        </ul>
+
−
                    </li>
+
  
−
                    <li class="m_nav_item dropdown" >
+
                      <li class="m_nav_item dropdown" >
−
                        <a href="#" class="dropdown-toggle link" data-toggle="dropdown">Team<b class="caret"></b></a>
+
                          <a href="#" class="dropdown-toggle link" data-toggle="dropdown">Safety<b class="caret"></b></a>
−
                        <ul class="dropdown-menu ">
+
                          <ul class="dropdown-menu ">
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Team">Teammates</a></li>
+
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Safety">Environment</a></li>
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Attributions">Attribution</a></li>
+
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Safety/Lab">Laboratory</a></li>
−
                            <li><a href="https://2017.igem.org/Team:ZJU-China/Collaborations">Collaboration</a></li>
+
                          </ul>
−
                        </ul>
+
                      </li>
−
                    </li>
+
  
−
                </ul>
+
                      <li class="m_nav_item dropdown">
−
            </div>
+
                          <a href="#" class="dropdown-toggle link" data-toggle="dropdown">HP<b class="caret"></b></a>
−
        </nav>
+
                          <ul class="dropdown-menu ">
−
    </div>
+
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Human_Practices">Summary</a></li>
−
</div>
+
                              <li><a href="https://2017.igem.org/Team:ZJU-China/HP/Silver">Silver</a></li>
 +
                              <li><a href="https://2017.igem.org/Team:ZJU-China/HP/Gold_Integrated">Gold</a></li>
 +
                          </ul>
 +
                      </li>
 +
 
 +
                      <li class="m_nav_item dropdown" >
 +
                          <a href="#" class="dropdown-toggle link" data-toggle="dropdown">Team<b class="caret"></b></a>
 +
                          <ul class="dropdown-menu ">
 +
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Team">Teammates</a></li>
 +
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Attributions">Attribution</a></li>
 +
                              <li><a href="https://2017.igem.org/Team:ZJU-China/Collaborations">Collaboration</a></li>
 +
                          </ul>
 +
                      </li>
 +
 
 +
                  </ul>
 +
              </div>
 +
          </nav>
 +
      </div>
 +
  </div>
  
  
 
<p></p>
 
<p></p>
 
<div style="margin-top:0;padding-top:0">
 
<div style="margin-top:0;padding-top:0">
−
    <img src="https://static.igem.org/mediawiki/2017/b/be/ZJUChina_interlab_banner.jpg" width="100%">
+
  <img src="https://static.igem.org/mediawiki/2017/0/0a/ZJU_China_home_banner.jpg" width="100%">
−
    <!-- <img src="images/HP_temp/banner.jpg" width="100%"> -->
+
  <!-- <img src="images/HP_temp/banner.jpg" width="100%"> -->
 
</div>
 
</div>
  
  
−
<div style="background-color: #FFFAF0;width: 100%" class="container zjuContent">
+
<div style="width: 100%" class="container zjuContent">
−
    <div class="col-md-3"></div>
+
  <div class="col-md-3"></div>
 
     <div class="col-md-9" role="main">
 
     <div class="col-md-9" role="main">
−
        <div class="bs-docs-section">
+
      <div class="bs-docs-section">
  
−
            <h1 id="modeling" class="page-header ArticleHead GreenAH">Modeling<hr></h1>
 
−
                <h2 id="vocclassification" class="H2Head">CoCulture</h2>
 
−
                    <h3 id="overview" class="H3Head">Overview</h3>
 
−
                        <p class="PP">The VOC device is designed to judge whether the tobacco is heathy or gets infected. Since this is an inquiry experiment, algorithms in data analysis are widely use in our modeling. We do data preprocessing, data analysis, and algorithm optimization on the data collected by VOC device. Finally, we use Logistic regression and detect the infected tobacco with 91% confidence.</p>
 
  
−
                    <h3 id="datapreprocessing" class="H3Head">Data preprocessing</h3>
+
  <h1 id="introduction" class="page-header ArticleHead GreenAH">Introduction<hr></h1>
−
                        <p class="PP">First we defragment the raw input data, and reorganize them into a matrix. 10 VOC factors are served as features, and the status(heathy or infected) is served as tag to be predicted.</p>
+
  
−
                    <h3 id="dataanalysis" class="H3Head">Data analysis</h3>
+
<h1 id="methods" class="GreenAH ArticleHead ">h1</h1>
−
                        <p class="PP">Our target is to create a model and predict tobacco's status according to 10 input features. This is a classic two classification problem, and there are several algrithm to solve it. The sampling algorithm is cross validation and the scoring policy we apply is ridit test.</p>
+
<h2 id="transformation" class="H2Head">h2</h2>
−
                        <p class="PP"><strong>Decision Tree</strong></p>
+
<h3 class="H3Head">h3</h3>
−
                        <p class="PP">First we use decision tree based on information theory. ID3 decision tree is used to reduce the most information gain, and CART tree is used to reduce the GINI index. The performance of these two algorithm is almost the same. <strong>R = 0.83</strong></p>
+
<p class="PP">p</p>
−
                <h2 id="summary" class="H2Head">Summary</h2>
+
−
                    <p class="PP">In this model, we try different algorithm to abttain a robust, interpretable, and accurate solution
+
−
                    to predict whether the tobacco is infected only according to 4 features in 91% confidence. Since
+
−
                    there are 6 VOC sensors are meaningless in this model, we the device can also be simplified by
+
−
                    reduce them.</p>
+
−
            <br><br><br>
+
−
            <div style="text-align: center">
+
−
                <a style="text-align: center" class="CuteButton YellowCB " href="https://2017.igem.org/Team:ZJU-China/Model">Another model: VOC</a>
+
−
            </div>
+
−
            <br><br><br><br>
+
−
        </div>
+
  
 +
<p class="PP">
 +
    <ul class="Retract textli">
 +
        <li>li1</li>
 +
        <li>li2</li>
 +
        <li>li3</li>
 +
        <li>li4</li>
 +
    </ul>
 +
</p>
  
 +
  <!-- Table -->
 +
  <table class="table" style="margin-left: 30%">
 +
  <tr>
 +
<th class="yellowTable"> </th>
 +
<th class="yellowTable">A</th>
 +
<th class="yellowTable">B</th>
 +
</tr>
  
−
        </div>
+
<tr>
−
</div>
+
<th class="greyTable"> </th>
 +
<td> </td>
 +
<td> </td>
 +
</tr>
  
−
        <!-- 右侧监听开始 -->
+
<tr>
−
        <div class="col-md-3 disappear-on-top" role="complementary">
+
<th class="greyTable"> </th>
−
            <nav style="position: fixed; top: 100px ; left:50px; "
+
<td> </td>
−
                class="bs-docs-sidebar hidden-print hidden-xs hidden-sm">
+
<td> </td>
−
                <ul class="nav bs-docs-sidenav">
+
</tr>
−
                    <li><a href="#modeling">Modelling</a></li>
+
  </table>
−
                    <li>
+
      </div>
−
                        <a href="#vocclassification">VOC Classification</a>
+
−
                        <ul class="nav">
+
−
                            <li><a href="#datapreprocessing">Transformation</a></li>
+
−
                            <li><a href="#dataanalysis">Data Analysis</a></li>
+
−
                            <li><a href="#algorithmoptimization">Algorithm Optimization</a></li>
+
−
                            <li><a href="#summary">Summary</a></li>
+
−
                        </ul>
+
−
                    </li>
+
  
  
−
                </ul>
 
  
−
                <a class="back-to-top" href="#top">
+
<!-- 右侧监听开始 -->
−
                    <!--   <i class="fa fa-arrow-up nav_icon"></i> -->
+
<div class="col-md-3 disappear-on-top" role="complementary">
−
                    <img style="width: 50px;" src="https://static.igem.org/mediawiki/2017/d/da/ZJU_China_UP.png">
+
  <nav  style="position: fixed; top: 100px ; left:50px; " class="bs-docs-sidebar hidden-print hidden-xs hidden-sm">
−
                </a>
+
    <ul class="nav bs-docs-sidenav">
 +
      <li><a href="#">A</a></li>
 +
      <li>
 +
        <a href="#">B</a>
 +
          <ul class="nav">
 +
            <li><a href="#">A</a></li>
 +
            <li><a href="#">B</a></li>
 +
            <li><a href="#">C</a></li>
 +
          </ul>
 +
      </li>
  
 +
    </ul>
  
−
             </nav>
+
  <a class="back-to-top" href="#top">
 +
  <!--  <i class="fa fa-arrow-up nav_icon"></i> -->
 +
    <img style="width: 50px;" src="https://static.igem.org/mediawiki/2017/d/da/ZJU_China_UP.png">
 +
  </a>
 +
 
 +
              
 +
          </nav>
 
         </div>
 
         </div>
−
 
+
       
 +
      </div>
 +
</div>
 
<!-- 右侧监听结束 -->
 
<!-- 右侧监听结束 -->
 
<!-- footer开始 -->
 
<!-- footer开始 -->
−
<div class="footer" style="background-color: #000000">
+
<div class="footer" style="background-color: #000000">
−
    <div class="copyright container text-center">
+
  <div class="copyright container text-center">
−
        <p class="copyright"><br></p>
+
      <p><br></p>
−
        <p class="copyright">Copyright &copy; 2017 ZJU-IGEM | <a href="http://www.zju.edu.cn/">Zhejiang University</a> |
+
    <p class="copyright">Copyright &copy; 2017 ZJU-IGEM | <a href="http://www.zju.edu.cn/">Zhejiang University</a> |</p>
−
        </p>
+
    <p><br></p>
−
        <!--<p class="copyright">Contact us:<a class="copyright" href="">WeChat</a></p>-->
+
  </div>
−
        <p class="copyright"><br></p>
+
−
    </div>
+
 
</div>
 
</div>
 
<!-- footer结束 -->
 
<!-- footer结束 -->
Line 597: Line 623:
  
 
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
 
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
−
<!--script src="js/bootstrap.min.js"></script-->
+
  <!--script src="js/bootstrap.min.js"></script-->
−
<script src="https://static.igem.org/mediawiki/2017/8/85/ZJUChina_js_docsmin.txt"></script>
+
  <script src="https://static.igem.org/mediawiki/2017/8/85/ZJUChina_js_docsmin.txt"></script>
−
<!--script src="js/button.js"></script-->
+
  <!--script src="js/button.js"></script-->
−
<script src="https://static.igem.org/mediawiki/2017/2/22/ZJUChina_bootstrap.min.txt"></script>
+
  <script src="https://static.igem.org/mediawiki/2017/2/22/ZJUChina_bootstrap.min.txt"></script>
−
<script src="https://static.igem.org/mediawiki/2017/3/32/ZJUChina_docs.min.txt"></script>
+
  <script src="https://static.igem.org/mediawiki/2017/3/32/ZJUChina_docs.min.txt"></script>
−
<script src="https://static.igem.org/mediawiki/2017/e/e0/ZJUChina_button.txt"></script>
+
  <script src="https://static.igem.org/mediawiki/2017/e/e0/ZJUChina_button.txt"></script>
  
−
<!--<script src="js/scrolling-nav.js"></script>-->
+
  <!--<script src="js/scrolling-nav.js"></script>-->
−
<script src="https://2017.igem.org/Zju/js/scrollingnav?action=raw&ctype=text/javascript"></script>
+
  <script src="https://2017.igem.org/Zju/js/scrollingnav?action=raw&ctype=text/javascript"></script>
−
<script src="https://static.igem.org/mediawiki/2017/c/c0/ZJUChina_txtSmoothScroll.min.txt"></script>
+
  <script src="https://static.igem.org/mediawiki/2017/c/c0/ZJUChina_txtSmoothScroll.min.txt"></script>
  
−
</body>
+
  </body>
 
</html>
 
</html>

Revision as of 23:59, 23 October 2017

Introduction

h1

h2

h3

p

  • li1
  • li2
  • li3
  • li4

A B


Copyright © 2017 ZJU-IGEM | Zhejiang University |