|
|
| Line 1: |
Line 1: |
| − | {{HZAU-China}}
| |
| − | <!DOCTYPE html>
| |
| | <html> | | <html> |
| | | | |
| | <head> | | <head> |
| − | <meta charset="UTF-8">
| + | <title>test</title> |
| − | <style type="text/css">
| + | |
| − | /* HTML5 display-role reset for older browsers */ | + | |
| − | | + | |
| − | article,
| + | |
| − | aside,
| + | |
| − | details,
| + | |
| − | figcaption,
| + | |
| − | figure,
| + | |
| − | footer,
| + | |
| − | header,
| + | |
| − | hgroup,
| + | |
| − | nav,
| + | |
| − | section {
| + | |
| − | display: block;
| + | |
| − | }
| + | |
| − | | + | |
| − | ol,
| + | |
| − | ul {
| + | |
| − | list-style: none;
| + | |
| − | }
| + | |
| − | | + | |
| − | blockquote,
| + | |
| − | q {
| + | |
| − | quotes: none;
| + | |
| − | }
| + | |
| − | | + | |
| − | blockquote:before,
| + | |
| − | blockquote:after,
| + | |
| − | q:before,
| + | |
| − | q:after {
| + | |
| − | content: '';
| + | |
| − | content: none;
| + | |
| − | }
| + | |
| − | | + | |
| − | table {
| + | |
| − | border-collapse: collapse;
| + | |
| − | border-spacing: 0;
| + | |
| − | }
| + | |
| − | </style>
| + | |
| − | <!--内容的样式-->
| + | |
| − | <style>
| + | |
| − | body {
| + | |
| − | font-family: "Arial", Helvetica, sans-serif;
| + | |
| − | text-align: justify;
| + | |
| − | margin: 0px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .HZAU_content {
| + | |
| − | position: relative;
| + | |
| − | right: 0px;
| + | |
| − | width: 1000px;
| + | |
| − | height: 3000px;
| + | |
| − | margin: 0 0 0 250px;
| + | |
| − | z-index: -1;
| + | |
| − | }
| + | |
| − | | + | |
| − | .HZAU_2017_menu {
| + | |
| − | display: block;
| + | |
| − | position: fixed;
| + | |
| − | left: 15px;
| + | |
| − | top: 100px;
| + | |
| − | height: 337px;
| + | |
| − | width: 233px;
| + | |
| − | overflow: hidden;
| + | |
| − | }
| + | |
| − | | + | |
| − | .beijin {
| + | |
| − | height: 337px;
| + | |
| − | width: 233px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .HZAU_2017_menu ul {
| + | |
| − | position: absolute;
| + | |
| − | top: 50%;
| + | |
| − | margin-top: -80px;
| + | |
| − | margin-left: 0px;
| + | |
| − | left: 0px;
| + | |
| − | width: 100%;
| + | |
| − | padding-left: 0px;
| + | |
| − | font-size: 16px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .HZAU_2017_menu li {
| + | |
| − | width: 100%;
| + | |
| − | }
| + | |
| − | | + | |
| − | .HZAU_2017_menu li a {
| + | |
| − | display: inline-block;
| + | |
| − | width: 100%;
| + | |
| − | height: 100%;
| + | |
| − | padding: 20px 0px 20px 0px;
| + | |
| − | margin-left: 13px;
| + | |
| − | text-align: left;
| + | |
| − | color: rgb(249, 228, 137);
| + | |
| − | text-decoration: none;
| + | |
| − | font-style: arial;
| + | |
| − | line-height: 90%;
| + | |
| − | }
| + | |
| − | | + | |
| − | .HZAU_2017_menu li:hover {
| + | |
| − | background: rgb(249, 228, 137);
| + | |
| − | }
| + | |
| − | | + | |
| − | .HZAU_2017_menu li a:hover {
| + | |
| − | color: #000;
| + | |
| − | }
| + | |
| − | | + | |
| − | .item {
| + | |
| − | width: 100%;
| + | |
| − | padding-left: 40px;
| + | |
| − | | + | |
| − | | + | |
| − | }
| + | |
| − | | + | |
| − | .biaoti {
| + | |
| − | font-size: 50px;
| + | |
| − | font-weight: bold;
| + | |
| − | text-align: center;
| + | |
| − | width: 100%;
| + | |
| − | display: block;
| + | |
| − | padding-bottom: 50px;
| + | |
| − | padding-top: 50px;
| + | |
| − | color: rgb(63, 59, 58);
| + | |
| − | }
| + | |
| − | | + | |
| − | .zhengwen {
| + | |
| − | font-style: arial;
| + | |
| − | font-size: 24px;
| + | |
| − | line-height: 120%;
| + | |
| − | text-align: justify;
| + | |
| − | color: #000;
| + | |
| − | }
| + | |
| − | | + | |
| − | .zhengwen {
| + | |
| − | padding: 33px;
| + | |
| − | display: absolute;
| + | |
| − | top: -66px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .tu_1 {
| + | |
| − | position: relative;
| + | |
| − | left: 450px;
| + | |
| − | padding-top: 30px;
| + | |
| − | padding-bottom: 30px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .tu_2 {
| + | |
| − | position: relative;
| + | |
| − | left: 450px;
| + | |
| − | padding-top: 30px;
| + | |
| − | padding-bottom: 30px;
| + | |
| − | }
| + | |
| − | </style>
| + | |
| | </head> | | </head> |
| | | | |
| | <body> | | <body> |
| − | <div class=" HZAU_2017_menu"> | + | <div style=" position:fixed;height:50px;background:# ccc;width: 100%;display:none" id=" topbar"></div> |
| − | <img src="https://static.igem.org/mediawiki/2017/8/8e/HZAU_2017_background_1.png" class="beijin">
| + | <div style="height:80000px;">content</div> |
| − | <ul class="daohang">
| + | |
| − | <li id="HZAU_menu_1">
| + | |
| − | <a href="#" id="bianse_1">Background</a>
| + | |
| − | </li>
| + | |
| − | <li id="HZAU_menu_2">
| + | |
| − | <a href="#item2_1" id="bianse_2">Information</a>
| + | |
| − | </li>
| + | |
| − | <li id="HZAU_menu_3">
| + | |
| − | <a href="#item3_1" id="bianse_3">Why light control</a>
| + | |
| − | </li>
| + | |
| − | </ul>
| + | |
| − | </div>
| + | |
| − | <div class="HZAU_content wrap">
| + | |
| − | <div class="item" id="item1">
| + | |
| − | <a class="biaoti">Description</a>
| + | |
| − | <a class="zhengwen">In the long history of life evolution, different species living in different environment developed the most adaptive
| + | |
| − | surviving mechanism for them under the selection pressure, among which some unmatchable become widly preserved in
| + | |
| − | different creatures, and the mechanism of replication is one of them. The majority of prokaryote share the same mechanism
| + | |
| − | of self-replication including DNA replication, chromosome seperation and cell division. These three parts comprised
| + | |
| − | the whole cell cycle, and the main model creature for researching the replication process is E.coli, which at the
| + | |
| − | same time is the main object of our project.</a>
| + | |
| − | </div>
| + | |
| − | <img src="https://static.igem.org/mediawiki/2017/b/bc/HZAU_2017_tu1_1.png" class="tu_1">
| + | |
| − | | + | |
| − | <div class="item" id="item2">
| + | |
| − | <div id="item2_1" class="zhengwen"></div>
| + | |
| − | <a class="zhengwen">The replication process of E.coli replication can be devided into phase B,C and D, three phases. Phase B, also called
| + | |
| − | pre-replication phase, is for DNA replication proparation similar as G1 phase in eukaryote cell cycle. Phase C is
| + | |
| − | regarded as replication phase during which the chromosome is replicating corespond to the S phase in eukaryote. The
| + | |
| − | last phase, phase D, is called post-replication phase, in which the behave of chromosome seperation and cell division
| + | |
| − | happend just like what happened in G2 and M phase of eukaryote cells. the time of C phase and D phase in a generation
| + | |
| − | is relative constant, so what actually determines the cell cycle is the initiation of genome replication. We know
| + | |
| − | that cell have to garantee that each cell should have at least one chormosome, and this requires a highly coordination
| + | |
| − | between DNA replication and cell divsion. Though the delicate mechanism of the corrdination is still a puzzle, it
| + | |
| − | is clear that DnaA protein plays a significant role in this event. DnaA is a versatile protein, it can not only behave
| + | |
| − | like a helicase opening the duble-helix of replication initiation site, OriC, while have the function of raising
| + | |
| − | other proteins forming into the replisome to prolong the replication, but also can anchor the replicationg choromosome
| + | |
| − | on the cell membrane leading the following seperation of chromosome. But what makes it the linker between replication
| + | |
| − | and division is that its concentration determines the initiation volume of replication. So according to these information,
| + | |
| − | we think that regulating the combination of DNA and DnaA protein will be an efficient method to regulate cell replication.
| + | |
| − | <a href="">For more information please click here.</a>
| + | |
| − | </a>
| + | |
| − | </div> | + | |
| − | <img src="https://static.igem.org/mediawiki/2017/5/51/HZAU_2017_tu2_1.png" class="tu_2">
| + | |
| − | | + | |
| − | <div class="item" id="item3">
| + | |
| − | <div id="item3_1" class="zhengwen"></div>
| + | |
| − | <a class="zhengwen">There will be about 1h for an entire genome replication, but cell division can reach about 20min per generation. this
| + | |
| − | reflects the multi-copy number of bacterial genome and only with this mechanism can E.coli reproduce in such a high
| + | |
| − | speed. what's worse is that even isogenic cells grow in the same culture have a scattering distribution not only
| + | |
| − | in phase but also in genome copy number. the strong heterogenic in cell cycle and genome copy number hinds the 3D
| + | |
| − | genome research and may be a potential noise on genome gene expression. At the same time, the developing synthetic
| + | |
| − | biology requires an approach that can control cell reproduction and can be easily incorporated into circuits, so
| + | |
| − | that the whole system can be more safe and controlable. taking these into consider, we decided to use CRISPRi to
| + | |
| − | inhibit its cell cycle, for more details please see design.</a>
| + | |
| − | <a class="zhengwen">But barely pause the replication in some circumstance can't satisfy our needs, and long time inhibition will prolong
| + | |
| − | its length, so there is a need to totally control its replication, not only block but also open. with that purpose
| + | |
| − | we decided to use optogentic to control this system, and the operablity of light to computer makes our system programable,
| + | |
| − | which can be called 4C.</a>
| + | |
| − | </div>
| + | |
| − | <a class="ppp"></a>
| + | |
| − | </div>
| + | |
| − | | + | |
| | </body> | | </body> |
| − | <script> | + | <script type="text/javascript"> |
| − | document.getElementById("bianse_1").style.color = "black";
| + | window.onscroll = function () { |
| − | document.getElementById("HZAU_menu_1").style.backgroundColor = "rgb(249,228,137)";
| + | var top = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop; |
| − | window.onscroll = function gundong() {
| + | var node = document.getElementById('topbar'); |
| − | var t = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop,
| + | if (top > 500) { |
| − | bianse_1 = document.getElementById("bianse_1"),
| + | node.style.display = '';//采用默认值 |
| − | bianse_2 = document.getElementById("bianse_2"),
| + | } else { |
| − | bianse_3 = document.getElementById("bianse_3"),
| + | node.style.display = 'none'; |
| − | HZAU_menu_1 = document.getElementById("HZAU_menu_1"),
| + | } |
| − | HZAU_menu_2 = document.getElementById("HZAU_menu_2"),
| + | |
| − | HZAU_menu_3 = document.getElementById("HZAU_menu_3");
| + | |
| − | | + | |
| − | if (t > 0 && t < 625.8) {
| + | |
| − | bianse_1.style.color = "black";
| + | |
| − | bianse_2.style.color = "rgb(249,228,137)";
| + | |
| − | bianse_3.style.color = "rgb(249,228,137)";
| + | |
| − | HZAU_menu_1.style.backgroundColor = "rgb(249,228,137)";
| + | |
| − | HZAU_menu_2.style.backgroundColor = "";
| + | |
| − | HZAU_menu_3.style.backgroundColor = "";
| + | |
| − | | + | |
| − | }
| + | |
| − | if (t >= 625.8 && t < 1605.2) {
| + | |
| − | bianse_1.style.color = "rgb(249,228,137)";
| + | |
| − | bianse_2.style.color = "black";
| + | |
| − | bianse_3.style.color = "rgb(249,228,137)";
| + | |
| − | HZAU_menu_1.style.backgroundColor = "";
| + | |
| − | HZAU_menu_2.style.backgroundColor = "rgb(249,228,137)";
| + | |
| − | HZAU_menu_3.style.backgroundColor = "";
| + | |
| − | | + | |
| − | }
| + | |
| − | if (t >= 1605.2) {
| + | |
| − | bianse_1.style.color = "rgb(249,228,137)";
| + | |
| − | bianse_2.style.color = "rgb(249,228,137)";
| + | |
| − | bianse_3.style.color = "black";
| + | |
| − | HZAU_menu_1.style.backgroundColor = "";
| + | |
| − | HZAU_menu_2.style.backgroundColor = "";
| + | |
| − | HZAU_menu_3.style.backgroundColor = "rgb(249,228,137)";
| + | |
| − | | + | |
| | } | | } |
| − | }
| |
| − | guidong();
| |
| | </script> | | </script> |
| | | | |
| | </html> | | </html> |
