Difference between revisions of "Team:HBUT-China"

 
(48 intermediate revisions by the same user not shown)
Line 1: Line 1:
−
{{HBUT-China}}
 
 
<html>
 
<html>
 
<head>
 
<head>
−
<style>
+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
−
body{
+
<meta name="viewport" content="width=device-width, initial-scale=1">
−
  max-height:100%;
+
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
−
  background-color:#FFF;
+
<link rel="stylesheet" href="http://123.207.175.242/csdn/css/igem-style.css">
−
  font-family:F2U Scratch;
+
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
−
}
+
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
−
#cssmenu,
+
<script type="text/javascript" src="http://123.207.175.242/csdn/js/menulist.js"></script>
−
#cssmenu ul,
+
<script type="text/javascript" src="http://123.207.175.242/csdn/js/jq22.js"></script>  
−
#cssmenu ul li,
+
−
#cssmenu ul li a,
+
−
#cssmenu #menu-button {
+
−
  margin: 0;
+
−
  padding: 0;
+
−
  border: 0;
+
−
  list-style: none;
+
−
  line-height: 1;
+
−
  display: block;
+
−
  position: relative;
+
−
  -webkit-box-sizing: border-box;
+
−
  -moz-box-sizing: border-box;
+
−
  box-sizing: border-box;
+
−
}
+
−
#cssmenu:after,
+
−
#cssmenu > ul:after {
+
−
  content: ".";
+
−
  display: block;
+
−
  clear: both;
+
−
  visibility: hidden;
+
−
  line-height: 0;
+
−
  height: 0;
+
−
}
+
−
#cssmenu #menu-button {
+
−
  display: none;
+
−
}
+
−
#cssmenu {
+
−
  width: auto;
+
−
  font-family: 'Open Sans', sans-serif;
+
−
  line-height: 1;
+
−
  background: #ffffff;
+
−
}
+
−
#menu-line {
+
−
  position: absolute;
+
−
  top: 0;
+
−
  left: 0;
+
−
  height: 3px;
+
−
  background: #009ae1;
+
−
  -webkit-transition: all 0.25s ease-out;
+
−
  -moz-transition: all 0.25s ease-out;
+
−
  -ms-transition: all 0.25s ease-out;
+
−
  -o-transition: all 0.25s ease-out;
+
−
  transition: all 0.25s ease-out;
+
−
}
+
−
#cssmenu > ul > li {
+
−
  float: left;
+
−
}
+
−
#cssmenu.align-center > ul {
+
−
  font-size: 0;
+
−
  text-align: center;
+
−
}
+
−
#cssmenu.align-center > ul > li {
+
−
  display: inline-block;
+
−
  float: none;
+
−
}
+
−
#cssmenu.align-center ul ul {
+
−
  text-align: left;
+
−
}
+
−
#cssmenu.align-right > ul > li {
+
−
  float: right;
+
−
}
+
−
#cssmenu.align-right ul ul {
+
−
  text-align: right;
+
−
}
+
−
#cssmenu > ul > li > a {
+
−
  padding: 20px;
+
−
  font-size: 12px;
+
−
  text-decoration: none;
+
−
  text-transform: uppercase;
+
−
  color: #000000;
+
−
  -webkit-transition: color .2s ease;
+
−
  -moz-transition: color .2s ease;
+
−
  -ms-transition: color .2s ease;
+
−
  -o-transition: color .2s ease;
+
−
  transition: color .2s ease;
+
−
}
+
−
#cssmenu > ul > li:hover > a,
+
−
#cssmenu > ul > li.active > a {
+
−
  color: #009ae1;
+
−
}
+
−
#cssmenu > ul > li.has-sub > a {
+
−
  padding-right: 25px;
+
−
}
+
−
#cssmenu > ul > li.has-sub > a::after {
+
−
  position: absolute;
+
−
  top: 21px;
+
−
  right: 10px;
+
−
  width: 4px;
+
−
  height: 4px;
+
−
  border-bottom: 1px solid #000000;
+
−
  border-right: 1px solid #000000;
+
−
  content: "";
+
−
  -webkit-transform: rotate(45deg);
+
−
  -moz-transform: rotate(45deg);
+
−
  -ms-transform: rotate(45deg);
+
−
  -o-transform: rotate(45deg);
+
−
  transform: rotate(45deg);
+
−
  -webkit-transition: border-color 0.2s ease;
+
−
  -moz-transition: border-color 0.2s ease;
+
−
  -ms-transition: border-color 0.2s ease;
+
−
  -o-transition: border-color 0.2s ease;
+
−
  transition: border-color 0.2s ease;
+
−
}
+
−
#cssmenu > ul > li.has-sub:hover > a::after {
+
−
  border-color: #009ae1;
+
−
}
+
−
#cssmenu ul ul {
+
−
  position: absolute;
+
−
  left: -9999px;
+
−
}
+
−
#cssmenu li:hover > ul {
+
−
  left: auto;
+
−
}
+
−
#cssmenu.align-right li:hover > ul {
+
−
  right: 0;
+
−
}
+
−
#cssmenu ul ul ul {
+
−
  margin-left: 100%;
+
−
  top: 0;
+
−
}
+
−
#cssmenu.align-right ul ul ul {
+
−
  margin-left: 0;
+
−
  margin-right: 100%;
+
−
}
+
−
#cssmenu ul ul li {
+
−
  height: 0;
+
−
  -webkit-transition: height .2s ease;
+
−
  -moz-transition: height .2s ease;
+
−
  -ms-transition: height .2s ease;
+
−
  -o-transition: height .2s ease;
+
−
  transition: height .2s ease;
+
−
}
+
−
#cssmenu ul li:hover > ul > li {
+
−
  height: 32px;
+
−
}
+
−
#cssmenu ul ul li a {
+
−
  padding: 10px 20px;
+
−
  width: 160px;
+
−
  font-size: 12px;
+
−
  background: #333333;
+
−
  text-decoration: none;
+
−
  color: #dddddd;
+
−
  -webkit-transition: color .2s ease;
+
−
  -moz-transition: color .2s ease;
+
−
  -ms-transition: color .2s ease;
+
−
  -o-transition: color .2s ease;
+
−
  transition: color .2s ease;
+
−
}
+
−
#cssmenu ul ul li:hover > a,
+
−
#cssmenu ul ul li a:hover {
+
−
  color: #ffffff;
+
−
}
+
−
#cssmenu ul ul li.has-sub > a::after {
+
−
  position: absolute;
+
−
  top: 13px;
+
−
  right: 10px;
+
−
  width: 4px;
+
−
  height: 4px;
+
−
  border-bottom: 1px solid #dddddd;
+
−
  border-right: 1px solid #dddddd;
+
−
  content: "";
+
−
  -webkit-transform: rotate(-45deg);
+
−
  -moz-transform: rotate(-45deg);
+
−
  -ms-transform: rotate(-45deg);
+
−
  -o-transform: rotate(-45deg);
+
−
  transform: rotate(-45deg);
+
−
  -webkit-transition: border-color 0.2s ease;
+
−
  -moz-transition: border-color 0.2s ease;
+
−
  -ms-transition: border-color 0.2s ease;
+
−
  -o-transition: border-color 0.2s ease;
+
−
  transition: border-color 0.2s ease;
+
−
}
+
−
#cssmenu.align-right ul ul li.has-sub > a::after {
+
−
  right: auto;
+
−
  left: 10px;
+
−
  border-bottom: 0;
+
−
  border-right: 0;
+
−
  border-top: 1px solid #dddddd;
+
−
  border-left: 1px solid #dddddd;
+
−
}
+
−
#cssmenu ul ul li.has-sub:hover > a::after {
+
−
  border-color: #ffffff;
+
−
}
+
−
@media all and (max-width: 768px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
+
−
  #cssmenu {
+
−
    width: 100%;
+
−
  }
+
−
  #cssmenu ul {
+
−
    width: 100%;
+
−
    display: none;
+
−
  }
+
−
  #cssmenu.align-center > ul,
+
−
  #cssmenu.align-right ul ul {
+
−
    text-align: left;
+
−
  }
+
−
  #cssmenu ul li,
+
−
  #cssmenu ul ul li,
+
−
  #cssmenu ul li:hover > ul > li {
+
−
    width: 100%;
+
−
    height: auto;
+
−
    border-top: 1px solid rgba(120, 120, 120, 0.15);
+
−
  }
+
−
  #cssmenu ul li a,
+
−
  #cssmenu ul ul li a {
+
−
    width: 100%;
+
−
  }
+
−
  #cssmenu > ul > li,
+
−
  #cssmenu.align-center > ul > li,
+
−
  #cssmenu.align-right > ul > li {
+
−
    float: none;
+
−
    display: block;
+
−
  }
+
−
  #cssmenu ul ul li a {
+
−
    padding: 20px 20px 20px 30px;
+
−
    font-size: 12px;
+
−
    color: #000000;
+
−
    background: none;
+
−
  }
+
−
  #cssmenu ul ul li:hover > a,
+
−
  #cssmenu ul ul li a:hover {
+
−
    color: #000000;
+
−
  }
+
−
  #cssmenu ul ul ul li a {
+
−
    padding-left: 40px;
+
−
  }
+
−
  #cssmenu ul ul,
+
−
  #cssmenu ul ul ul {
+
−
    position: relative;
+
−
    left: 0;
+
−
    right: auto;
+
−
    width: 100%;
+
−
    margin: 0;
+
−
  }
+
−
  #cssmenu > ul > li.has-sub > a::after,
+
−
  #cssmenu ul ul li.has-sub > a::after {
+
−
    display: none;
+
−
  }
+
−
  #menu-line {
+
−
    display: none;
+
−
  }
+
−
  #cssmenu #menu-button {
+
−
    display: block;
+
−
    padding: 20px;
+
−
    color: #000000;
+
−
    cursor: pointer;
+
−
    font-size: 12px;
+
−
    text-transform: uppercase;
+
−
  }
+
−
  #cssmenu #menu-button::after {
+
−
    content: '';
+
−
    position: absolute;
+
−
    top: 20px;
+
−
    right: 20px;
+
−
    display: block;
+
−
    width: 15px;
+
−
    height: 2px;
+
−
    background: #000000;
+
−
  }
+
−
  #cssmenu #menu-button::before {
+
−
    content: '';
+
−
    position: absolute;
+
−
    top: 25px;
+
−
    right: 20px;
+
−
    display: block;
+
−
    width: 15px;
+
−
    height: 3px;
+
−
    border-top: 2px solid #000000;
+
−
    border-bottom: 2px solid #000000;
+
−
  }
+
−
  #cssmenu .submenu-button {
+
−
    position: absolute;
+
−
    z-index: 10;
+
−
    right: 0;
+
−
    top: 0;
+
−
    display: block;
+
−
    border-left: 1px solid rgba(120, 120, 120, 0.15);
+
−
    height: 52px;
+
−
    width: 52px;
+
−
    cursor: pointer;
+
−
  }
+
−
  #cssmenu .submenu-button::after {
+
−
    content: '';
+
−
    position: absolute;
+
−
    top: 21px;
+
−
    left: 26px;
+
−
    display: block;
+
−
    width: 1px;
+
−
    height: 11px;
+
−
    background: #000000;
+
−
    z-index: 99;
+
−
  }
+
−
  #cssmenu .submenu-button::before {
+
−
    content: '';
+
−
    position: absolute;
+
−
    left: 21px;
+
−
    top: 26px;
+
−
    display: block;
+
−
    width: 11px;
+
−
    height: 1px;
+
−
    background: #000000;
+
−
    z-index: 99;
+
−
  }
+
−
  #cssmenu .submenu-button.submenu-opened:after {
+
−
    display: none;
+
−
  }
+
−
}
+
−
 
+
−
</style>
+
 
</head>
 
</head>
 
<body>
 
<body>
−
<div id='cssmenu'>
+
<div class="top-nav">
−
  <ul>
+
  <div id='cssmenu'>
−
      <li class="active"><a href='#'>首页</a></li>
+
      <ul>
−
       <li class='has-sub'><a href='#'>网页特效</a>
+
        <li><img src="https://static.igem.org/mediawiki/2017/5/55/HBUT-logo2.png" height="45"/></li>
−
        <ul>
+
       </ul>
−
            <li class='has-sub'><a href='#'>jQuery特效</a>
+
  </div>
−
              <ul>
+
</div>
−
                  <li><a href='#'>HTML5</a></li>
+
<!-- one bt one slider -->
−
                  <li><a href='#'>CSS3</a></li>
+
<div class="js-silder">
−
              </ul>
+
  <div class="silder-scroll">
−
            </li>
+
<div class="silder-main">
−
            <li class='has-sub'><a href='#'>JS代码</a>
+
<div class="silder-main-img">
−
              <ul>
+
<img src="//2017.igem.org/wiki/images/8/8c/Hbut-banner1.png" alt="">
−
                  <li><a href='#'>Nav2</a></li>
+
</div>
−
                  <li><a href='#'>Nav3</a></li>
+
<div class="silder-main-img">
−
              </ul>
+
<img src="//2017.igem.org/wiki/images/5/55/Hbut-member.jpeg" alt="">
−
            </li>
+
</div>
−
         </ul>
+
−
       </li>
+
</div>
−
      <li><a href='#'>jQuery</a></li>
+
</div>
−
      <li><a href='#'>flash动画</a></li>
+
</div>
−
   </ul>
+
 
 +
 
 +
 
 +
 
 +
<div class="content-main">
 +
  <div class="container">
 +
      <div class="row">
 +
        <div class="col-lg-2"></div>
 +
        <div class="col-lg-8 project-desc">
 +
            <div class="page-header">
 +
              <h1>Project Description</h1>
 +
            </div>
 +
            <small>Overview</small>
 +
            <p>For this year's iGEM Competition, our team has focused on putting forward a biological approach to detecting nickel ions as a heavy metal contaminant in the natural environment. Through our study over this summer, we are expecting to control the expression of red fluorescent protein by changing the nickel ion concentration. In a certain concentration range, we will try to establish a quantitative relationship between the intensity of the fluorescence and the concentration of nickel ions in the environment. This may build a nickel ion concentration quantitative detection system.</p>
 +
            <p>In order to achieve this goal, we use a nickel-sensitive repressive promoter (pncrA). In the absence of nickel ions, the repressor protein (NcrB) binds to the promoter, preventing the expression of the subsequent gene. The nickel ions in the environment can bind to repressor proteins to alter the domain of the protein, so that the fluorescent protein gene behind the promoter is expressed and produces fluorescence.</p>
 +
        </div>
 +
         <div class="col-lg-2"></div>
 +
       </div>
 +
<br/><br/><br/><br/>
 +
  </div>
 +
</div>
 +
<div id="footer">
 +
   <p>copyright &copy;  2017 IGEM-HBUT-China All rights reserved.</p>
 
</div>
 
</div>
 +
<script src="http://123.207.175.242/csdn/js/wySilder.min.js" type="text/javascript"></script>
 +
<script>
 +
$(function (){
 +
$(".js-silder").silder({
 +
auto: true,//自动播放，传入任何可以转化为true的值都会自动轮播
 +
speed: 20,//轮播图运动速度
 +
sideCtrl: true,//是否需要侧边控制按钮
 +
bottomCtrl: true,//是否需要底部控制按钮
 +
defaultView: 0,//默认显示的索引
 +
interval: 3000,//自动轮播的时间，以毫秒为单位，默认3000毫秒
 +
activeClass: "active",//小的控制按钮激活的样式，不包括作用两边，默认active
 +
});
 +
});
 +
</script>
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 02:33, 1 November 2017

Project Description

Overview

For this year's iGEM Competition, our team has focused on putting forward a biological approach to detecting nickel ions as a heavy metal contaminant in the natural environment. Through our study over this summer, we are expecting to control the expression of red fluorescent protein by changing the nickel ion concentration. In a certain concentration range, we will try to establish a quantitative relationship between the intensity of the fluorescence and the concentration of nickel ions in the environment. This may build a nickel ion concentration quantitative detection system.

In order to achieve this goal, we use a nickel-sensitive repressive promoter (pncrA). In the absence of nickel ions, the repressor protein (NcrB) binds to the promoter, preventing the expression of the subsequent gene. The nickel ions in the environment can bind to repressor proteins to alter the domain of the protein, so that the fluorescent protein gene behind the promoter is expressed and produces fluorescence.