Difference between revisions of "Team:NTU-LIHPAO-Taiwan/Basic Part"
(Prototype team page) |
|||
Line 1: | Line 1: | ||
− | |||
<html> | <html> | ||
+ | <head> | ||
− | < | + | <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> |
+ | <script type="text/javascript" charset="utf-8"> | ||
+ | |||
+ | //-----Hover Facebook Icon-----// | ||
+ | $(document).ready(function(){ | ||
+ | $('#Facebook_icon_hover').hover(function () { | ||
+ | this.src = "https://static.igem.org/mediawiki/2015/3/35/NTU-Top-Facebook_icon2.png"; | ||
+ | }, function () { | ||
+ | this.src = "https://static.igem.org/mediawiki/2015/9/98/NTU-Top-Facebook_icon1.png"; | ||
+ | }); | ||
+ | }); | ||
+ | |||
+ | //-----Hover iGem Icon-----// | ||
+ | $(document).ready(function(){ | ||
+ | $('#iGEM_icon_hover').hover(function () { | ||
+ | this.src = "https://static.igem.org/mediawiki/2015/0/0a/NTU-Top-iGEM_icon2.png"; | ||
+ | }, function () { | ||
+ | this.src = "https://static.igem.org/mediawiki/2015/1/1d/NTU-Top-iGEM_icon1.png"; | ||
+ | }); | ||
+ | }); | ||
+ | |||
+ | //-----Hover NTU Icon-----// | ||
+ | $(document).ready(function(){ | ||
+ | $('#NTU_icon_hover').hover(function () { | ||
+ | this.src = "https://static.igem.org/mediawiki/2015/6/6e/NTU-Top-NTU_icon2.png"; | ||
+ | }, function () { | ||
+ | this.src = "https://static.igem.org/mediawiki/2015/1/14/NTU-Top-NTU_icon1.png"; | ||
+ | }); | ||
+ | }); | ||
+ | |||
+ | </script> | ||
+ | |||
+ | <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | ||
+ | <title>NTU-LIHPAO-Taiwan</title> | ||
+ | <style type="text/css"> | ||
+ | |||
+ | /*-------------------------------------------*/ | ||
+ | /*--------------Wiki Page Reset--------------*/ | ||
+ | /*-------------------------------------------*/ | ||
+ | |||
+ | #contentSub, #contentcontainer, #footer-box, #sitesub, #catlinks, #search-controls, #p-logo, .h3, .printfooter, .firstHeading, .visualClear { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | #globalWrapper, #content { | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | border: 0px; | ||
+ | background-color: transparent; | ||
+ | margin: 0px; | ||
+ | padding: 0px; | ||
+ | } | ||
+ | |||
+ | html, body, .wrapper { | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | background-color: transparent; | ||
+ | } | ||
+ | |||
+ | /*-------------------------------------------*/ | ||
+ | /*-------------------Body--------------------*/ | ||
+ | /*-------------------------------------------*/ | ||
+ | |||
+ | body { | ||
+ | background-color: #F0F0F0; | ||
+ | } | ||
+ | body,td,th { | ||
+ | font-size: 14px; | ||
+ | font-family: Calibri, "Arial Narrow", "Agency FB", "Raavi"; | ||
+ | } | ||
+ | #Wrapper { | ||
+ | margin-right: auto; | ||
+ | margin-left: auto; | ||
+ | background-color: #FFF; | ||
+ | margin-top: 0px; | ||
+ | margin-bottom: 0px; | ||
+ | width: 90%; | ||
+ | height: 10000px; | ||
+ | top: 0px; | ||
+ | left: 5%; | ||
+ | right: 5%; | ||
+ | position: absolute; | ||
+ | bottom: 0px; | ||
+ | padding-top: 0px; | ||
+ | padding-bottom: 0px; | ||
+ | z-index: 0; | ||
+ | } | ||
+ | |||
+ | #Wrapper_TopPic { | ||
+ | margin-right: auto; | ||
+ | margin-left: auto; | ||
+ | background-color: #FFF; | ||
+ | margin-top: 0px; | ||
+ | margin-bottom: 0px; | ||
+ | width: 100%; | ||
+ | height: 58px; | ||
+ | top: 0px; | ||
+ | left:0px; | ||
+ | right:0px; | ||
+ | position: fixed; | ||
+ | bottom: 0px; | ||
+ | padding-top: 0px; | ||
+ | padding-bottom: 0px; | ||
+ | z-index: 9998; | ||
+ | border-bottom-style: solid; | ||
+ | border-bottom-color: #fe5838; | ||
+ | border-bottom-width: 2px; | ||
+ | z-index: 9998; | ||
+ | background-repeat: no-repeat; | ||
+ | } | ||
+ | |||
+ | #Wrapper_Bottom { | ||
+ | width: 100%; | ||
+ | height: 100px; | ||
+ | bottom: 0px; | ||
+ | top: auto; | ||
+ | background-color: #FFF; | ||
+ | border-top-style: solid; | ||
+ | border-top-color: #079235; | ||
+ | border-top-width: 3px; | ||
+ | margin-right: auto; | ||
+ | margin-left: auto; | ||
+ | margin-top: 0px; | ||
+ | margin-bottom: 0px; | ||
+ | z-index: 9998; | ||
+ | position: absolute; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | /*-------------------------------------------*/ | ||
+ | /*-----------------Top icons-----------------*/ | ||
+ | /*-------------------------------------------*/ | ||
+ | #Facebook_icon_pic { | ||
+ | height: 30px; | ||
+ | width: 30px; | ||
+ | position: absolute; | ||
+ | left: auto; | ||
+ | top: 23px; | ||
+ | right: 5.5%; | ||
+ | bottom: auto; | ||
+ | z-index: 9999; | ||
+ | } | ||
+ | |||
+ | #iGEM_icon_pic { | ||
+ | height: 30px; | ||
+ | width: 38px; | ||
+ | position: absolute; | ||
+ | left: auto; | ||
+ | top: 23px; | ||
+ | right: 1%; | ||
+ | bottom: auto; | ||
+ | z-index: 9999; | ||
+ | } | ||
+ | |||
+ | #NTU_icon_pic { | ||
+ | height: 30px; | ||
+ | width: 69px; | ||
+ | position: absolute; | ||
+ | left: auto; | ||
+ | top: 23px; | ||
+ | right: 9%; | ||
+ | bottom: auto; | ||
+ | z-index: 9999; | ||
+ | } | ||
+ | |||
+ | #NTUXLIHPAO_icon { | ||
+ | height: 40px; | ||
+ | width: 200px; | ||
+ | position: absolute; | ||
+ | left: 3%; | ||
+ | top: 18px; | ||
+ | right: auto; | ||
+ | bottom: auto; | ||
+ | z-index: 9999; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | /*-------------------------------------------*/ | ||
+ | /*---------------Bottom icons----------------*/ | ||
+ | /*-------------------------------------------*/ | ||
+ | |||
+ | #NTUschool_logo { | ||
+ | height: 70px; | ||
+ | width: 265px; | ||
+ | position: absolute; | ||
+ | left: 25%; | ||
+ | top: 5px; | ||
+ | right: auto; | ||
+ | bottom: auto; | ||
+ | z-index: 9999; | ||
+ | margin-left: -132px; | ||
+ | } | ||
+ | |||
+ | #LIHPAO_logo { | ||
+ | height: 70px; | ||
+ | width: 215px; | ||
+ | position: absolute; | ||
+ | left: 75%; | ||
+ | top: 5px; | ||
+ | right: auto; | ||
+ | bottom: auto; | ||
+ | z-index: 9999; | ||
+ | margin-left: -107px; | ||
+ | } | ||
+ | |||
+ | #NTUBST_logo { | ||
+ | height: 70px; | ||
+ | width: 70px; | ||
+ | position: absolute; | ||
+ | left: 50%; | ||
+ | top: 5px; | ||
+ | right: auto; | ||
+ | bottom: auto; | ||
+ | z-index: 9999; | ||
+ | margin-left: -35px; | ||
+ | } | ||
+ | |||
+ | #Bottom_Text { | ||
+ | color: #767676; | ||
+ | bottom: 0px; | ||
+ | width: 100%; | ||
+ | height: auto; | ||
+ | font-size: 15px; | ||
+ | position: absolute; | ||
+ | text-align: center; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*-------------------------------------------*/ | ||
+ | /*-----------------Slide Menu----------------*/ | ||
+ | /*-------------------------------------------*/ | ||
+ | .Slidemenu { | ||
+ | z-index: 9999; | ||
+ | position: absolute; | ||
+ | top: 32px; | ||
+ | bottom: 0px; | ||
+ | left: 50%; | ||
+ | right: 15%; | ||
+ | list-style:none; | ||
+ | margin:0; | ||
+ | padding:0; | ||
+ | position: absolute; | ||
+ | margin-left: -350px; | ||
+ | /*background:rgba(100%,100%,100%,0); 主選單色系選擇*/ | ||
+ | } | ||
+ | |||
+ | .Slidemenu ul { | ||
+ | *zoom:1; | ||
+ | list-style:none; | ||
+ | margin:0; | ||
+ | padding:0; | ||
+ | /*background:rgba(100%,100%,100%,0); 主選單色系選擇*/ | ||
+ | } | ||
+ | |||
+ | .Slidemenu ul:before,.Slidemenu ul:after { | ||
+ | content:""; | ||
+ | display:table; | ||
+ | } | ||
+ | |||
+ | .Slidemenu ul:after { | ||
+ | clear:both; | ||
+ | } | ||
+ | |||
+ | .Slidemenu a { | ||
+ | text-decoration:none; | ||
+ | display:block; | ||
+ | padding:4px 4px; | ||
+ | line-height:1em; | ||
+ | color:#000; | ||
+ | text-align: center; | ||
+ | vertical-align: middle; | ||
+ | height: auto; | ||
+ | width: auto; | ||
+ | font-family: "Agency FB"; | ||
+ | font-size: 1em; | ||
+ | } | ||
+ | |||
+ | .Slidemenu a:hover { | ||
+ | text-decoration:none; | ||
+ | background:rgba(0,0,0,0.03); | ||
+ | text-align: center; | ||
+ | vertical-align: middle; | ||
+ | } | ||
+ | |||
+ | .Slidemenu li ul { | ||
+ | position:absolute; | ||
+ | left:0; | ||
+ | top:26px; | ||
+ | z-index:1; | ||
+ | } | ||
+ | |||
+ | .Slidemenu li ul li { | ||
+ | overflow:hidden; | ||
+ | height: 0px; | ||
+ | margin-bottom: 0px; | ||
+ | } | ||
+ | |||
+ | .Slidemenu li ul a { | ||
+ | border:none; | ||
+ | -webkit-transition:background 300ms ease-in-out; | ||
+ | -moz-transition:background 300ms ease-in-out; | ||
+ | -o-transition:background 300ms ease-in-out; | ||
+ | transition:background 300ms ease-in-out; | ||
+ | line-height:1.1em; | ||
+ | } | ||
+ | |||
+ | .Slidemenu li ul a:hover { | ||
+ | background-color: rgba(240,240,240,1); | ||
+ | } | ||
+ | |||
+ | .Slidemenu ul > li { | ||
+ | text-decoration:none; | ||
+ | float: left; | ||
+ | position: relative; | ||
+ | height: 27px; /*--改主要選單高度--*/ | ||
+ | } | ||
+ | |||
+ | #width_small { | ||
+ | width: 100px; /*--改主要選單寬度--*/ | ||
+ | } | ||
+ | |||
+ | #width_large { | ||
+ | width: 140px; /*--改主要選單寬度--*/ | ||
+ | } | ||
+ | |||
+ | .Slidemenu ul > li:hover ul.subs { | ||
+ | height: auto; | ||
+ | width: 150px; /*--改拉出的選單寬度--*/ | ||
+ | border-left-width: 3px; | ||
+ | border-left-style: solid; | ||
+ | border-left-color: #3300FF; | ||
+ | background:rgba(255,255,255,1); /*--改拉出選單顏色--*/ | ||
+ | } | ||
+ | |||
+ | .Slidemenu ul > li:hover ul li { | ||
+ | text-decoration:none; | ||
+ | height: 26px; /*--改拉出的選單高度--*/ | ||
+ | width: 150px; /*--改拉出的選單寬度--*/ | ||
+ | text-align: center; | ||
+ | vertical-align: middle; | ||
+ | -webkit-transition:height 250ms ease-in; | ||
+ | -moz-transition:height 250ms ease-in; | ||
+ | -o-transition:height 250ms ease-in; | ||
+ | transition:height 250ms ease-in; | ||
+ | } | ||
+ | |||
+ | #Position_Now { | ||
+ | background:rgba(0,0,0,0.03); | ||
+ | } | ||
+ | |||
+ | |||
+ | /*-------------------------------------------*/ | ||
+ | /*------------------Content------------------*/ | ||
+ | /*-------------------------------------------*/ | ||
+ | |||
+ | #Content * { | ||
+ | list-style: none; | ||
+ | } | ||
+ | |||
+ | #Content_Container { | ||
+ | position: fixed; | ||
+ | width: 17.8%; | ||
+ | height: 100%; | ||
+ | left: 5.2%; | ||
+ | right: auto; | ||
+ | background: #f7fbff; | ||
+ | z-index: 5; | ||
+ | } | ||
+ | |||
+ | #Content { | ||
+ | position: absolute; | ||
+ | top: 60px; | ||
+ | width: 100%; | ||
+ | height: auto; | ||
+ | padding: 0; | ||
+ | margin: 0; | ||
+ | transition: 0.5s; | ||
+ | font-size: 0.8rem; | ||
+ | font-family: Calibri; | ||
+ | } | ||
+ | |||
+ | #Content-title { | ||
+ | position: absolute; | ||
+ | width: 100%; | ||
+ | top: 0.5rem; | ||
+ | font-size: 1.5rem; | ||
+ | text-align: center; | ||
+ | } | ||
+ | |||
+ | #Content ul { | ||
+ | margin: 0.5rem 0rem 0.5rem; | ||
+ | } | ||
+ | |||
+ | .main-Content { | ||
+ | position: absolute; | ||
+ | top: 5rem; | ||
+ | left: 2rem; | ||
+ | } | ||
+ | |||
+ | .main-Content #title { | ||
+ | color: #ABCDEF; | ||
+ | } | ||
+ | |||
+ | .main-Content > li { | ||
+ | cursor: pointer; | ||
+ | color: #369CF5; | ||
+ | font-size: 25px; | ||
+ | padding-top: 5px; | ||
+ | padding-bottom: 5px; | ||
+ | } | ||
+ | |||
+ | .sub-Content { | ||
+ | font-size: 18px; | ||
+ | overflow-y: auto; | ||
+ | transition: 0.5s; | ||
+ | width: 10rem; | ||
+ | padding-left: 2rem; | ||
+ | padding-right: 1rem; | ||
+ | } | ||
+ | |||
+ | .sub-Content > li { | ||
+ | padding-top: 8px; | ||
+ | padding-bottom: 8px; | ||
+ | } | ||
+ | |||
+ | .sub-Content > li a{ | ||
+ | display: block; | ||
+ | color: #0791DB; | ||
+ | text-decoration: none; | ||
+ | transition: 0.5s; | ||
+ | } | ||
+ | |||
+ | .sub-Content > li a:hover { | ||
+ | opacity: 0.5; | ||
+ | } | ||
+ | |||
+ | #Healthin_Logo_Content { | ||
+ | width: 100%; | ||
+ | height: auto; | ||
+ | } | ||
+ | |||
+ | #Healthin_Logo { | ||
+ | top: 45px; | ||
+ | padding-left: 3%; | ||
+ | padding-right: 3%; | ||
+ | position: absolute; | ||
+ | width: 94%; | ||
+ | height: 94%; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*-------------------------------------------*/ | ||
+ | /*-----------------Articles------------------*/ | ||
+ | /*-------------------------------------------*/ | ||
+ | |||
+ | #Articles { | ||
+ | width: 76%; | ||
+ | height: 10000px; | ||
+ | left: 22%; | ||
+ | right: 2%; | ||
+ | top: -10px; | ||
+ | position: absolute; | ||
+ | background-color: #FFF; | ||
+ | z-index: 0; | ||
+ | color: #000; | ||
+ | } | ||
+ | |||
+ | .ContentBox { | ||
+ | width: 100%; | ||
+ | height: 675px; | ||
+ | } | ||
+ | |||
+ | .Text1 { | ||
+ | font-size: 28px; | ||
+ | font-family: Calibri; | ||
+ | left: 20px; | ||
+ | right: 20px; | ||
+ | padding-top: 80px; | ||
+ | padding-right: 20px; | ||
+ | padding-bottom: 10px; | ||
+ | padding-left: 20px; | ||
+ | border-bottom-width: 2px; | ||
+ | border-bottom-style: dashed; | ||
+ | border-bottom-color: #fe5838; | ||
+ | } | ||
+ | |||
+ | .Text2 { | ||
+ | font-size: 24px; | ||
+ | font-family: Calibri; | ||
+ | padding-top: 30px; | ||
+ | padding-right: 50px; | ||
+ | padding-bottom: 10px; | ||
+ | padding-left: 50px; | ||
+ | } | ||
+ | |||
+ | .Text3 { | ||
+ | font-size: 20px; | ||
+ | font-family: Calibri; | ||
+ | text-align: justify; | ||
+ | padding-top: 3px; | ||
+ | padding-right: 80px; | ||
+ | padding-bottom: 3px; | ||
+ | padding-left: 110px; | ||
+ | line-height: 26px; | ||
+ | } | ||
+ | |||
+ | .Text_TitleUnderline { | ||
+ | font-size: 22px; | ||
+ | font-family: Calibri; | ||
+ | text-align: justify; | ||
+ | padding-top: 15px; | ||
+ | padding-bottom: 10px; | ||
+ | line-height: 26px; | ||
+ | color: #6c13aa; | ||
+ | text-decoration: underline; | ||
+ | } | ||
+ | |||
+ | Underline { | ||
+ | text-decoration: underline; | ||
+ | } | ||
+ | |||
+ | Green { | ||
+ | color: #00b050; | ||
+ | } | ||
+ | |||
+ | Red { | ||
+ | color: #c00000; | ||
+ | } | ||
+ | |||
+ | Blue { | ||
+ | color: #0070c0; | ||
+ | } | ||
+ | |||
+ | Super { | ||
+ | vertical-align: super; | ||
+ | } | ||
+ | |||
+ | Sub { | ||
+ | vertical-align: sub; | ||
+ | } | ||
+ | |||
+ | ol.part1 { | ||
+ | list-style-type: none; | ||
+ | margin-left: 0px; | ||
+ | } | ||
+ | |||
+ | ol.part2 { | ||
+ | list-style-type: decimal; | ||
+ | margin-left: 0px; | ||
+ | } | ||
+ | |||
+ | ol.part3 { | ||
+ | list-style-type: lower-alpha; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | table, td, th { | ||
+ | border: 1px solid green; | ||
+ | vertical-align: middle; | ||
+ | text-align: center; | ||
+ | font-size: 20px; | ||
+ | width: 300px; | ||
+ | height: auto; | ||
+ | border-collapse: collapse; | ||
+ | margin-left: 20px; | ||
+ | margin-top: 10px; | ||
+ | margin-bottom: 10px; | ||
+ | } | ||
+ | |||
+ | th { | ||
+ | background-color: green; | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | tr.alt td { | ||
+ | border-top: 3px solid green; | ||
+ | } | ||
+ | |||
+ | </style> | ||
+ | </head> | ||
+ | |||
+ | |||
+ | <!----------------------------------------> | ||
+ | <!----------------------------------------> | ||
+ | <!------------------BODY------------------> | ||
+ | <!----------------------------------------> | ||
+ | <!----------------------------------------> | ||
+ | |||
+ | <body> | ||
+ | |||
+ | <div id="Wrapper"> | ||
+ | <div id="Wrapper_TopPic"> | ||
+ | <div id="NTUXLIHPAO_icon"><img src="https://static.igem.org/mediawiki/2015/c/c7/NTU-Top-NTUXLIHPAO.png" height="40" /></div> | ||
+ | <div id="Facebook_icon_pic"> | ||
+ | <a href="https://www.facebook.com/NationalTaiwanUniversityiGEM"><img id="Facebook_icon_hover" src="https://static.igem.org/mediawiki/2015/9/98/NTU-Top-Facebook_icon1.png" /></a></div> | ||
+ | <div id="iGEM_icon_pic"> | ||
+ | <a href="https://igem.org/Main_Page"><img id="iGEM_icon_hover" src="https://static.igem.org/mediawiki/2015/1/1d/NTU-Top-iGEM_icon1.png" /></a></div> | ||
+ | <div id="NTU_icon_pic"> | ||
+ | <a href="http://www.ntu.edu.tw/english/index.html"><img id="NTU_icon_hover" src="https://static.igem.org/mediawiki/2015/1/14/NTU-Top-NTU_icon1.png" /></a></div> | ||
+ | |||
+ | <div class="Slidemenu"> | ||
+ | <ul> | ||
+ | <li><div id=width_small><a href="https://2015.igem.org/Team:NTU-LIHPAO-Taiwan">Home</a></div> | ||
+ | </li> | ||
+ | |||
+ | <li><div id=width_small><a href="https://2015.igem.org/Team:NTU-LIHPAO-Taiwan/Team">Team</a></div> | ||
+ | </li> | ||
+ | |||
+ | <li><div id=width_small span style="cursor:default"><a>Project</a></div> | ||
+ | <ul class="subs"> | ||
+ | <li><a href="https://2015.igem.org/Team:NTU-LIHPAO-Taiwan/Project/Abstract">Abstract</a></li> | ||
+ | <li><a href="https://2015.igem.org/Team:NTU-LIHPAO-Taiwan/Project/Overview">Overview</a></li> | ||
+ | <li><a href="https://2015.igem.org/Team:NTU-LIHPAO-Taiwan/Project/Parts">Parts</a></li> | ||
+ | <li><a href="https://2015.igem.org/Team:NTU-LIHPAO-Taiwan/Project/Results">Results</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | |||
+ | <li><div id=width_small span style="cursor:default"><a>Modeling</a></div> | ||
+ | <ul class="subs"> | ||
+ | <li><a href="https://2015.igem.org/Team:NTU-LIHPAO-Taiwan/Modeling/Abstract">Abstract</a></li> | ||
+ | <li><a href="https://2015.igem.org/Team:NTU-LIHPAO-Taiwan/Modeling/Simulation">Simulation</a></li> | ||
+ | <li><a href="https://2015.igem.org/Team:NTU-LIHPAO-Taiwan/Modeling/Results">Results</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | |||
+ | <li><div id=width_small span style="cursor:default"><div id=Position_Now><a>Notebook</a></div></div> | ||
+ | <ul class="subs"> | ||
+ | <li><a href="https://2015.igem.org/Team:NTU-LIHPAO-Taiwan/Notebook">Note</a></li> | ||
+ | <li><a href="https://2015.igem.org/Team:NTU-LIHPAO-Taiwan/Protocols">Protocols</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | |||
+ | <li><div id=width_small><a href="https://2015.igem.org/Team:NTU-LIHPAO-Taiwan/Safety">Safety</a></div> | ||
+ | </li> | ||
+ | |||
+ | <li><div id=width_large><a href="#">Human Practice</a></div> | ||
+ | <ul class="subs"> | ||
+ | <li><a href="#">Sub Item</a></li> | ||
+ | <li><a href="#">Sub Item</a></li> | ||
+ | <li><a href="#">Sub Item</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div id="Content_Container"> | ||
+ | <div id="Healthin_Logo_Content"><div id="Healthin_Logo"><img src="https://static.igem.org/mediawiki/2015/6/69/Healthin_White.png" style="max-width: 100%; height: auto"/></div></div> | ||
+ | <div id="Content"> | ||
+ | <ul class="main-Content"> | ||
+ | <li> | ||
+ | <span class="title">Notes</span> | ||
+ | <ul class="sub-Content"> | ||
+ | <li><a href="#First1">Preparation of Competent Cells (<i>E.coli</i>)</a></li> | ||
+ | <li><a href="#First2">DNA Dissolution</a></li> | ||
+ | <li><a href="#First3">Agarose Gel Electrophoresis</a></li> | ||
+ | <li><a href="#First4">Gel Extraction</a></li> | ||
+ | <li><a href="#First5">DNA Ligation</a></li> | ||
+ | <li><a href="#First6">Plasmid DNA Extraction Using Alkaline Lysis Method (<i>E.coli</i>)</a></li> | ||
+ | <li><a href="#First7">Transformation (<i>E.coli</i>)</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <script> | ||
+ | (function() { | ||
+ | var main_Contents = document.querySelectorAll("ul.main-Content>li"); | ||
+ | function ContentOpen(index) { | ||
+ | for (var i = 0; i < main_Contents.length; i++) { | ||
+ | var sub_Content = main_Contents[i].querySelector(".sub-Content"); | ||
+ | if (i === index) { | ||
+ | sub_Content.style.height = '20rem'; | ||
+ | } else { | ||
+ | sub_Content.style.height = '0'; | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | function makeContentOpenFunc(index) { | ||
+ | return function() { | ||
+ | ContentOpen(index); | ||
+ | }; | ||
+ | } | ||
+ | for (var i = 0; i < main_Contents.length; i++) { | ||
+ | main_Contents[i].onclick = makeContentOpenFunc(i); | ||
+ | } | ||
+ | ContentOpen(0); | ||
+ | })(); | ||
+ | </script> | ||
+ | |||
+ | <div id="Articles"> | ||
+ | <div class="ContentBox"> | ||
+ | <div class="ContentHolder"> | ||
+ | |||
+ | <div class="Text1" id="First1"><Red>Preparation of Competent Cells (<i>E.coli</i>)</Red></div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Materials and Reagents :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part1"> | ||
+ | <li><i>Escherichia coli</i> DH5α</li> | ||
+ | <li>LB broth</li> | ||
+ | <li>TB buffer</li> | ||
+ | <li>DMSO</li> | ||
+ | <li>Liquid nitrogen</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Equipment :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part1"> | ||
+ | <li>Ice</li> | ||
+ | <li>Shaker</li> | ||
+ | <li>Spectrometer</li> | ||
+ | <li>Centrifuge</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Procedure :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part2"> | ||
+ | <li>Inoculate 10μL <i>Escherichia coli</i> DH5α into 10mL LB broth (1:1000)</li> | ||
+ | <li>Grow for 12-16 hours at 37℃ with shaking</li> | ||
+ | <li>Inoculate 500μL <i>Escherichia coli</i> DH5α into 50mL LB broth (1:100)</li> | ||
+ | <li>Grow for 2 hours at 37℃ with shaking to O.D.<Sub>600</Sub>=0.4-0.6</li> | ||
+ | <li>Split the cell into two Falcon tubes, both contain 25 mL <i>Escherichia coli</i> DH5α</li> | ||
+ | <li>Centrifuge at 4℃, 3000rpm(800G) for 10 minutes</li> | ||
+ | <li>Discard the supernatant</li> | ||
+ | <li>Resuspend the cell pellet by gently adding 8.5mL TB buffer (1/3 V)</li> | ||
+ | <li>On ice for 10 minutes</li> | ||
+ | <li>Centrifuge at 4℃, 3000rpm(800G) for 10 minutes</li> | ||
+ | <li>Discard the supernatant using pipetman</li> | ||
+ | <li>Resuspend the cell pellet by gently adding 2mL TB buffer (1/12.5 V)</li> | ||
+ | <li>Add 150μL DMSO (7%)</li> | ||
+ | <li>On ice for 10 minutes</li> | ||
+ | <li>Transfer the cell to new eppendorfs with 60μL per tube</li> | ||
+ | <li>Freeze the cell in liquid nitrogen</li> | ||
+ | <li>Store the cell at -80℃</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text1" id="First2"><Red>DNA Dissolution</Red></div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Materials and Reagents :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part1"> | ||
+ | <li>DNA (BioBricks/synthesized)</li> | ||
+ | <li>ddH<Sub>2</Sub>O</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Procedure :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part2"> | ||
+ | <li>Add 10μL ddH<Sub>2</Sub>O</li> | ||
+ | <li>Wait for 1 minute until the DNA dissolve</li> | ||
+ | <li>Pipet several times and transfer the DNA to an eppendorf</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text1" id="First3"><Red>Agarose Gel Electrophoresis</Red></div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Materials and Reagents :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part1"> | ||
+ | <li>Agarose</li> | ||
+ | <li>1X TAE</li> | ||
+ | <li>Tracking dye</li> | ||
+ | <li>Marker (1kb/100bp)</li> | ||
+ | <li>EtBr</li> | ||
+ | <li>ddH<Sub>2</Sub>O</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Equipment :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part1"> | ||
+ | <li>Gel tray</li> | ||
+ | <li>Well comb</li> | ||
+ | <li>Electrophoresis tank</li> | ||
+ | <li>UV detector</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Procedure :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part2"> | ||
+ | <div class="Text_TitleUnderline">Casting an Agarose Gel (m/v = 1.0% or 1.5%)</div> | ||
+ | <li>Measure out appropriate mass of agarose powder into a serum bottle</li> | ||
+ | <li>Add appropriate volume of 1X TAE</li> | ||
+ | <li>Let agarose solution cool down to acceptable temperature for bare hands</li> | ||
+ | <li>Pour the solution into a gel tray with the well comb in place, and push the bubbles away with a pipette tip</li> | ||
+ | <li>Let sit at room temperature for 30 minutes, until it has completely solidified</li> | ||
+ | <div class="Text_TitleUnderline">Loading Samples and Running the Gel</div> | ||
+ | <li>Place the gel as well as its tray into the electrophoresis tank containing 1X TAE </li> | ||
+ | (Make sure that the surface is higher than the top of the gel and not overflow) | ||
+ | <li>Mix the samples with tracking dye (1/10 V) sufficiently</li> | ||
+ | <li>Load the samples into the each well</li> | ||
+ | <li>Load marker (usually in the first and last lane)</li> | ||
+ | <li>Set an appropriate voltage (full/half) and run the gel for 15-20 minutes</li> | ||
+ | <div class="Text_TitleUnderline">Imaging the Gel</div> | ||
+ | <li>Put the gel into a container filled with 1X TAE and EtBr, staining for 5 minutes</li> | ||
+ | <li>Replace EtBr solution with water and destain for 3 minutes</li> | ||
+ | <li>Put the gel in an UV detector and record the result</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text1" id="First4"><Red>Gel Extraction</Red></div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Materials and Reagents :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part1"> | ||
+ | <li>Gel/PCR buffer</li> | ||
+ | <li>W1 buffer</li> | ||
+ | <li>Wash buffer</li> | ||
+ | <li>ddH<Sub>2</Sub>O</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Equipment :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part1"> | ||
+ | <li>Cutter knife</li> | ||
+ | <li>Eppendorf</li> | ||
+ | <li>Vortex mixer</li> | ||
+ | <li>Dry bath incubator</li> | ||
+ | <li>DF Column & Collection tube</li> | ||
+ | <li>Mini Centrifuge</li> | ||
+ | <li>Microcentrifuge</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Procedure :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part2"> | ||
+ | <div class="Text_TitleUnderline">Gel Dissociation</div> | ||
+ | <li>Excise the agarose gel slice containing relevant DNA fragments and remove any extra agarose to minimize the size of the gel slice (<300μL)</li> | ||
+ | <li>Transfer the gel slice to an eppendorf</li> | ||
+ | <li>Add 500μL Gel/PCR buffer to the sample and mix by vortex</li> | ||
+ | <li>Incubate at 60℃ for 10-15 minutes to ensure the gel slice has been completely dissolved (invert the tube every 2-3 minutes)</li> | ||
+ | <li>Cool the dissolved sample mixture to room temperature</li> | ||
+ | <div class="Text_TitleUnderline">DNA Binding</div> | ||
+ | <li>Place the DF Column in a 2mL Collection tube</li> | ||
+ | <li>Transfer 800μL of the sample mixture to the DF Column</li> | ||
+ | <li>Discard the flow-through and place the DF Column back in the Collection tube</li> | ||
+ | (If the sample mixture is more than 800μL, repeat the DNA binding step) | ||
+ | <div class="Text_TitleUnderline">Wash</div> | ||
+ | <li>Add 400μL W1 buffer into the DF Column</li> | ||
+ | <li>Spin down for approximately 20 seconds</li> | ||
+ | <li>Discard the flow-through and place the DF Column back in the Collection tube</li> | ||
+ | <li>Add 600μL wash buffer (contains ethanol) into the DF Column</li> | ||
+ | <li>Let stand for 1 minute at room temperature</li> | ||
+ | <li>Spin down for approximately 30 seconds</li> | ||
+ | <li>Discard the flow-through and place the DF Column back in the Collection tube</li> | ||
+ | <li>Centrifuge at 12000 rpm for 3 minutes to dry the column matrix</li> | ||
+ | (Can be done twice) | ||
+ | <li>Discard the flow-through</li> | ||
+ | <div class="Text_TitleUnderline">DNA Elution</div> | ||
+ | <li>Transfer the dried DF Column to a new eppendorf (cap cut)</li> | ||
+ | <li>Add 30μL of 37℃ ddH2O into the center of the column matrix</li> | ||
+ | <li>Let stand for at least 2 minutes to ensure that ddH2O is completely absorbed</li> | ||
+ | <li>Centrifuge at 12000 rpm for 2 minutes to elute the purified DNA</li> | ||
+ | <li>Re-add the subnatant into the center of the column matrix</li> | ||
+ | <li>Centrifuge at 12000 rpm for 2 minutes to elute the purified DNA</li> | ||
+ | |||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text1" id="First5"><Red>DNA Ligation</Red></div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Materials and Reagents :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part1"> | ||
+ | <li>DNA (insert & vector)</li> | ||
+ | <li>Ligation high ver.2</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Equipment :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part1"> | ||
+ | <li>Cooling dry bath incubator</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Procedure :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part2"> | ||
+ | <li> | ||
+ | Table | ||
+ | <table> | ||
+ | <tr> | ||
+ | <th>Components</th> | ||
+ | <th>Volume (μL)</th> | ||
+ | </tr> | ||
+ | <tr> | ||
+ | <td>Insert</td> | ||
+ | <td>x</td> | ||
+ | </tr> | ||
+ | <tr> | ||
+ | <td>Vector</td> | ||
+ | <td>y</td> | ||
+ | </tr> | ||
+ | <tr> | ||
+ | <td>Ligation High</td> | ||
+ | <td>1</td> | ||
+ | </tr> | ||
+ | <tr class="alt"> | ||
+ | <td>Total</td> | ||
+ | <td>7</td> | ||
+ | </tr> | ||
+ | </table> | ||
+ | Molar ratio: insert/vector = 3/1 | ||
+ | <br> x + y = 6</br> | ||
+ | </li> | ||
+ | <li>Gently mix the solution by pipetting up and down</li> | ||
+ | <li>Incubate | ||
+ | <ol class="part3"> | ||
+ | <li>at 16℃ for 2 hours, or</li> | ||
+ | <li>at 37℃ for 1 hour, or</li> | ||
+ | <li>at 4℃ overnight</li> | ||
+ | </ol> | ||
+ | </li> | ||
+ | <li>Proceed with bacterial transformation</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | |||
+ | <div class="Text1" id="First6"><Red>Plasmid DNA Extraction Using Alkaline Lysis Method (<i>E. coli</i>)</Red></div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Materials and Reagents :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part1"> | ||
+ | <li><i>Escherichia coli</i> DH5α (with plasmid)</li> | ||
+ | <li>LB broth</li> | ||
+ | <li>Resuspension solution (MPI, with RNAase)</li> | ||
+ | <li>Lysis solution (MPII)</li> | ||
+ | <li>Neutralizing solution (MPIII)</li> | ||
+ | <li>Isopropanol</li> | ||
+ | <li>70% ethanol</li> | ||
+ | <li>ddH<Sub>2</Sub>O</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Equipment :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part1"> | ||
+ | <li>Shaker</li> | ||
+ | <li>Centrifuge</li> | ||
+ | <li>Vortex mixer</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Procedure :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part2"> | ||
+ | <li>Grow bacteria in LB broth with appropriate antibiotics at 37℃ overnight with shaking</li> | ||
+ | <li>Transfer 1.5mL culture to an eppendorf</li> | ||
+ | <li>Centrifuge at 4℃, 5000rpm for 5 minutes</li> | ||
+ | <li>Discard the supernatant</li> | ||
+ | <li>Add 150μL of resuspension solution (MPI, with RNAase) into each tube, pipet several times, and vortex to completely resuspend the cell pellet</li> | ||
+ | <li>Add 150μL of lysis solution (MPII), gently invert the tubes about 20 times, and then let the sample mixture stand at room temperature for 2 minutes</li> | ||
+ | <li>Add 150μL of neutralizing solution (MPIII) and mix by inverting the tubes about 20 times. Bacterial chromosomal DNA and proteins can be seen as white precipitates</li> | ||
+ | <li>Centrifuge at 4℃, 15000rpm for 15 minutes</li> | ||
+ | <li>Carefully transfer 400μL of the supernatant to a new eppendorf</li> | ||
+ | (Step 8&9 can be done twice) | ||
+ | <li>Add 400μL (same volume as the supernatant) isopropanol, and shake up the tubes as vigorously as one can</li> | ||
+ | <li>Centrifuge at 4℃, 15000rpm for 15 minutes</li> | ||
+ | <li>Discard the supernatant</li> | ||
+ | <li>Add 200μL of 70% ethanol to wash out the salts</li> | ||
+ | <li>Centrifuge at 4℃, 15000rpm for 5 minutes</li> | ||
+ | <li>Discard the supernatant and remove the remains as much as possible with pipetman</li> | ||
+ | <li>Air dry for about 30 minutes</li> | ||
+ | <li>Resuspend the DNA pellet with 20μL ddH<Sub>2</Sub>O</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text1" id="First7"><Red>Transformation (<i>E. coli</i>)</Red></div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Materials and Reagents :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part1"> | ||
+ | <li>Competent cell (<i>Escherichia coli</i> DH5α)</li> | ||
+ | <li>LB plate (Amp+/CP+)</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Equipment :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part1"> | ||
+ | <li>-80℃ refrigerator</li> | ||
+ | <li>Ice</li> | ||
+ | <li>37℃ incubator</li> | ||
+ | <li>Super optimal broth (SOB) (37℃)</li> | ||
+ | <li>Shaker</li> | ||
+ | </ol> | ||
+ | </div> | ||
+ | <div class="Text2"> | ||
+ | <Green>Procedure :</Green> | ||
+ | </div> | ||
+ | <div class="Text3"> | ||
+ | <ol class="part2"> | ||
+ | <li>Take out the competent cells from -80℃ refrigerator</li> | ||
+ | <li>Thaw the cells on ice for 5 minutes</li> | ||
+ | <li>Add 1μL plasmid DNA into the competent cells, and mix gently by pipetting</li> | ||
+ | <li>On ice for 10 minutes</li> | ||
+ | <li>Heat shock at 37℃ for 3 minutes</li> | ||
+ | <li>On ice for 2 minutes</li> | ||
+ | <li>Add 150μL 37℃ SOB into the mixture</li> | ||
+ | <li>Place the tube at 37℃ with shaking for 1 hour(Amp+)/4 hours(CP+) respectively</li> | ||
+ | <li>Spread the cells onto the LB plates (Amp+/ CP+)</li> | ||
+ | <li>Incubate the plates at 37℃ with shaking for 12-16 hours</li> | ||
+ | |||
+ | </ol> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
− | |||
− | |||
− | |||
− | |||
− | < | + | </div> |
− | + | </div> | |
− | </ | + | </div> |
− | < | + | <script> |
+ | $('.sub-Content>li a').click(function() { | ||
+ | console.log(this.hash); | ||
+ | if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') || location.hostname == this.hostname) { | ||
+ | var target = $('[id="'+this.hash.substring(1)+'"]'); | ||
+ | target = target.length ? target : $('[name="' + this.hash.slice(1) +'"]'); | ||
+ | if (target.length) { | ||
+ | $('html,body').animate({ | ||
+ | scrollTop: target.offset().top-15 | ||
+ | }, 700); | ||
+ | return false; | ||
+ | } | ||
+ | } | ||
+ | }); | ||
+ | |||
+ | $('.title').click(function() { | ||
+ | console.log(this.hash); | ||
+ | if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') || location.hostname == this.hostname) { | ||
+ | var target = $('[id="'+this.hash.substring(1)+'"]'); | ||
+ | target = target.length ? target : $('[name="' + this.hash.slice(1) +'"]'); | ||
+ | if (target.length) { | ||
+ | $('html,body').animate({ | ||
+ | scrollTop: target.offset().top-55 | ||
+ | }, 700); | ||
+ | return false; | ||
+ | } | ||
+ | } | ||
+ | }); | ||
+ | |||
+ | $('.Text1 > a').click(function() { | ||
+ | console.log(this.hash); | ||
+ | if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') || location.hostname == this.hostname) { | ||
+ | var target = $('[id="'+this.hash.substring(1)+'"]'); | ||
+ | target = target.length ? target : $('[name="' + this.hash.slice(1) +'"]'); | ||
+ | if (target.length) { | ||
+ | $('html,body').animate({ | ||
+ | scrollTop: target.offset().top-55 | ||
+ | }, 700); | ||
+ | return false; | ||
+ | } | ||
+ | } | ||
+ | }); | ||
+ | </script> | ||
+ | <div id="Wrapper_Bottom"> | ||
+ | <div id="NTUschool_logo"><a href="http://www.ntu.edu.tw/english/index.html"><img src="https://static.igem.org/mediawiki/2015/d/de/NTUschool_icon.png" height="70" /></a></div> | ||
+ | <div id="LIHPAO_logo"><a href="http://www.llsc.com.tw/"><img src="https://static.igem.org/mediawiki/2015/d/d4/LIHPAO_logo.png" height="70" /></a></div> | ||
+ | <div id="NTUBST_logo"><a href="http://www.bst.ntu.edu.tw/BST-new/NTUBST.html"><img src="https://static.igem.org/mediawiki/2015/6/68/NTUBST_logo.png" height="70" /></a></div> | ||
+ | <div id="Bottom_Text"> | ||
+ | Maintained by the iGEM team NTU-LIHPAO-Taiwan ©2015 NTU-LIHPAO-Taiwan | ||
+ | </div> | ||
+ | </div> | ||
</div> | </div> | ||
+ | </body> | ||
</html> | </html> |
Revision as of 07:22, 7 September 2015
- Escherichia coli DH5α
- LB broth
- TB buffer
- DMSO
- Liquid nitrogen
- Ice
- Shaker
- Spectrometer
- Centrifuge
- Inoculate 10μL Escherichia coli DH5α into 10mL LB broth (1:1000)
- Grow for 12-16 hours at 37℃ with shaking
- Inoculate 500μL Escherichia coli DH5α into 50mL LB broth (1:100)
- Grow for 2 hours at 37℃ with shaking to O.D.600=0.4-0.6
- Split the cell into two Falcon tubes, both contain 25 mL Escherichia coli DH5α
- Centrifuge at 4℃, 3000rpm(800G) for 10 minutes
- Discard the supernatant
- Resuspend the cell pellet by gently adding 8.5mL TB buffer (1/3 V)
- On ice for 10 minutes
- Centrifuge at 4℃, 3000rpm(800G) for 10 minutes
- Discard the supernatant using pipetman
- Resuspend the cell pellet by gently adding 2mL TB buffer (1/12.5 V)
- Add 150μL DMSO (7%)
- On ice for 10 minutes
- Transfer the cell to new eppendorfs with 60μL per tube
- Freeze the cell in liquid nitrogen
- Store the cell at -80℃
- DNA (BioBricks/synthesized)
- ddH2O
- Add 10μL ddH2O
- Wait for 1 minute until the DNA dissolve
- Pipet several times and transfer the DNA to an eppendorf
- Agarose
- 1X TAE
- Tracking dye
- Marker (1kb/100bp)
- EtBr
- ddH2O
- Gel tray
- Well comb
- Electrophoresis tank
- UV detector
- Measure out appropriate mass of agarose powder into a serum bottle
- Add appropriate volume of 1X TAE
- Let agarose solution cool down to acceptable temperature for bare hands
- Pour the solution into a gel tray with the well comb in place, and push the bubbles away with a pipette tip
- Let sit at room temperature for 30 minutes, until it has completely solidified
- Place the gel as well as its tray into the electrophoresis tank containing 1X TAE (Make sure that the surface is higher than the top of the gel and not overflow)
- Mix the samples with tracking dye (1/10 V) sufficiently
- Load the samples into the each well
- Load marker (usually in the first and last lane)
- Set an appropriate voltage (full/half) and run the gel for 15-20 minutes
- Put the gel into a container filled with 1X TAE and EtBr, staining for 5 minutes
- Replace EtBr solution with water and destain for 3 minutes
- Put the gel in an UV detector and record the result
Casting an Agarose Gel (m/v = 1.0% or 1.5%)
Loading Samples and Running the Gel
Imaging the Gel
- Gel/PCR buffer
- W1 buffer
- Wash buffer
- ddH2O
- Cutter knife
- Eppendorf
- Vortex mixer
- Dry bath incubator
- DF Column & Collection tube
- Mini Centrifuge
- Microcentrifuge
- Excise the agarose gel slice containing relevant DNA fragments and remove any extra agarose to minimize the size of the gel slice (<300μL)
- Transfer the gel slice to an eppendorf
- Add 500μL Gel/PCR buffer to the sample and mix by vortex
- Incubate at 60℃ for 10-15 minutes to ensure the gel slice has been completely dissolved (invert the tube every 2-3 minutes)
- Cool the dissolved sample mixture to room temperature
- Place the DF Column in a 2mL Collection tube
- Transfer 800μL of the sample mixture to the DF Column
- Discard the flow-through and place the DF Column back in the Collection tube (If the sample mixture is more than 800μL, repeat the DNA binding step)
- Add 400μL W1 buffer into the DF Column
- Spin down for approximately 20 seconds
- Discard the flow-through and place the DF Column back in the Collection tube
- Add 600μL wash buffer (contains ethanol) into the DF Column
- Let stand for 1 minute at room temperature
- Spin down for approximately 30 seconds
- Discard the flow-through and place the DF Column back in the Collection tube
- Centrifuge at 12000 rpm for 3 minutes to dry the column matrix (Can be done twice)
- Discard the flow-through
- Transfer the dried DF Column to a new eppendorf (cap cut)
- Add 30μL of 37℃ ddH2O into the center of the column matrix
- Let stand for at least 2 minutes to ensure that ddH2O is completely absorbed
- Centrifuge at 12000 rpm for 2 minutes to elute the purified DNA
- Re-add the subnatant into the center of the column matrix
- Centrifuge at 12000 rpm for 2 minutes to elute the purified DNA
Gel Dissociation
DNA Binding
Wash
DNA Elution
- DNA (insert & vector)
- Ligation high ver.2
- Cooling dry bath incubator
-
Table
Components Volume (μL) Insert x Vector y Ligation High 1 Total 7
x + y = 6 - Gently mix the solution by pipetting up and down
- Incubate
- at 16℃ for 2 hours, or
- at 37℃ for 1 hour, or
- at 4℃ overnight
- Proceed with bacterial transformation
- Escherichia coli DH5α (with plasmid)
- LB broth
- Resuspension solution (MPI, with RNAase)
- Lysis solution (MPII)
- Neutralizing solution (MPIII)
- Isopropanol
- 70% ethanol
- ddH2O
- Shaker
- Centrifuge
- Vortex mixer
- Grow bacteria in LB broth with appropriate antibiotics at 37℃ overnight with shaking
- Transfer 1.5mL culture to an eppendorf
- Centrifuge at 4℃, 5000rpm for 5 minutes
- Discard the supernatant
- Add 150μL of resuspension solution (MPI, with RNAase) into each tube, pipet several times, and vortex to completely resuspend the cell pellet
- Add 150μL of lysis solution (MPII), gently invert the tubes about 20 times, and then let the sample mixture stand at room temperature for 2 minutes
- Add 150μL of neutralizing solution (MPIII) and mix by inverting the tubes about 20 times. Bacterial chromosomal DNA and proteins can be seen as white precipitates
- Centrifuge at 4℃, 15000rpm for 15 minutes
- Carefully transfer 400μL of the supernatant to a new eppendorf (Step 8&9 can be done twice)
- Add 400μL (same volume as the supernatant) isopropanol, and shake up the tubes as vigorously as one can
- Centrifuge at 4℃, 15000rpm for 15 minutes
- Discard the supernatant
- Add 200μL of 70% ethanol to wash out the salts
- Centrifuge at 4℃, 15000rpm for 5 minutes
- Discard the supernatant and remove the remains as much as possible with pipetman
- Air dry for about 30 minutes
- Resuspend the DNA pellet with 20μL ddH2O
- Competent cell (Escherichia coli DH5α)
- LB plate (Amp+/CP+)
- -80℃ refrigerator
- Ice
- 37℃ incubator
- Super optimal broth (SOB) (37℃)
- Shaker
- Take out the competent cells from -80℃ refrigerator
- Thaw the cells on ice for 5 minutes
- Add 1μL plasmid DNA into the competent cells, and mix gently by pipetting
- On ice for 10 minutes
- Heat shock at 37℃ for 3 minutes
- On ice for 2 minutes
- Add 150μL 37℃ SOB into the mixture
- Place the tube at 37℃ with shaking for 1 hour(Amp+)/4 hours(CP+) respectively
- Spread the cells onto the LB plates (Amp+/ CP+)
- Incubate the plates at 37℃ with shaking for 12-16 hours