Team:SUSTC-Shenzhen-A DengLuo index

From 2012.igem.org

(Difference between revisions)
 
(45 intermediate revisions not shown)
Line 2: Line 2:
<head>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
-
<title>Scene Template, free website template</title>
+
<title>************************</title>
<meta name="keywords" content="scene, clean, professional, layout, free website templates, CSS, HTML" />
<meta name="keywords" content="scene, clean, professional, layout, free website templates, CSS, HTML" />
<meta name="description" content="Scene Template is a clean and professional website layout for free download." />
<meta name="description" content="Scene Template is a clean and professional website layout for free download." />
-
<link href="http://www.templatemo.com/templates/templatemo_195_scene/templatemo_style.css" rel="stylesheet" type="text/css" />
 
-
<link href="http://www.templatemo.com/templates/templatemo_195_scene/css/jquery.ennui.contentslider.css" rel="stylesheet" type="text/css" media="screen,projection" />
 
 +
<style type="text/css">
-
</head>
 
-
<body>
 
 +
<!--我们需要先把igem原网站的一些东西删掉-->
 +
#globalWrapper {width: 100%;  }
 +
#top-section {width: 100%; height:100%; border:none;}
 +
#p-logo {display:none;}
 +
#search-controls {display:none;}
 +
.printfooter {display:none;}
 +
#footer-box {border:none;}
 +
.firstHeading {display:none;}
 +
#content { border:none;  }
 +
#bodyContent {border:none;  }
 +
 +
<!--删除完毕-->
 +
 +
 +
 +
/*
 +
* Color, Border, and Button Rules
 +
*/
 +
.contentslider {
 +
  padding: 0; /* This acts as a border for the content slider */
 +
  background: none; /* This is the color of said border */
 +
    overflow:hidden;
 +
}
 +
.cs_wrapper, .cs_article {
 +
/*  background-color: none;  Background color for the entries */
 +
}
 +
.cs_leftBtn, .cs_rightBtn {
 +
margin-top: 50px;
 +
  width:52px; /* Should be as wide as the button graphic being used */
 +
/*  background: none;  This will probably match the contentslider bg color */
 +
}
 +
 +
/*
 +
* Article styles (font, color, etc.)
 +
*
 +
* If textResize is set to TRUE, sizing shouldn't need to be touched. However,
 +
* depending on the sizes you have defined, additional tweaking may be
 +
* required in order to get the text to display properly.
 +
*/
 +
 +
/*
 +
******************************************************************************
 +
* These styles may be affected by the plugin, so avoid changing them if
 +
* it's not absolutely necessary.
 +
******************************************************************************
 +
*/
 +
.contentslider {
 +
  position:relative;
 +
  display:block;
 +
  width: 535px;
 +
  height: 233px;
 +
  margin:0 auto;
 +
  overflow:hidden;
 +
}
 +
.cs_wrapper {
 +
  position:relative;
 +
  display:block;
 +
  width:100%;
 +
  height:100%;
 +
  margin:0;
 +
  padding:0;
 +
  overflow:hidden;
 +
}
 +
.cs_slider {
 +
  position:absolute;
 +
  width:10000px;
 +
  height:100%;
 +
  margin:0;
 +
  padding:0;
 +
    overflow:hidden;
 +
}
 +
.cs_article {
 +
  float:left;
 +
  position:relative;
 +
  top:0;
 +
  left:0;
 +
  display:block;
 +
  width: 535px;
 +
  height: 233px;
 +
  margin:0 auto;
 +
  padding: 0;
 +
/* background-color: none; */
 +
    overflow:hidden;
 +
}
 +
 +
.cs_article img {
 +
float: left;
 +
}
 +
 +
.cs_leftBtn, .cs_rightBtn {
 +
  position:absolute;
 +
  top: 0px;
 +
  height: 233px;
 +
  padding:0;
 +
  z-index:10000;
 +
}
 +
.cs_leftBtn {
 +
  left:0;
 +
  outline:0;
 +
}
 +
.cs_rightBtn {
 +
  right:0;
 +
  outline:0;
 +
}
 +
.cs_leftBtn img, .cs_rightBtn img {
 +
  border:0;
 +
  position:relative;
 +
  top: 10px;
 +
  margin:0;
 +
}
 +
 +
 +
 +
 +
 +
 +
body {
 +
margin: 0;
 +
padding: 0;
 +
line-height: 1.5em;
 +
font-family: Tahoma, Geneva, sans-serif;
 +
font-size: 10px;
 +
color: #6f6f6f;
 +
    background: #2ac5c0 url(https://static.igem.org/mediawiki/igem.org/2/24/Templatemo_body_top.jpg) repeat-x;
 +
}
 +
 +
a:link, a:visited { color: #17aba6; text-decoration: underline; font-weight: bold; }
 +
a:active, a:hover { color: #CC9900; text-decoration: none; }
 +
 +
p { margin: 0px; padding: 0px; }
 +
 +
img { margin: 0px; padding: 0px; border: none; }
 +
 +
.cleaner { clear: both; width: 100%; height: 0px; font-size: 0px;  }
 +
 +
.cleaner_h30 { clear: both; width:100%; height: 30px; }
 +
.cleaner_h40 { clear: both; width:100%; height: 40px; }
 +
 +
.margin_r10 { margin-right: 10px; }
 +
 +
.float_l { float: left; }
 +
.float_r { float:  right; }
 +
 +
 +
#templatemo_wrapper {
 +
width: 1024px;
 +
margin: 0 auto;
 +
}
 +
 +
#temmplatmeo_header {
 +
height: 96px;
 +
        margin-right: 50px
 +
background: url(https://static.igem.org/mediawiki/2012/9/91/Templatemo_menu.jpg) no-repeat bottom;
 +
}
 +
 +
/* site title */
 +
 +
#temmplatmeo_header  #site_title {
 +
float: left;
 +
width: 200px;
 +
padding: 10px 0 0 50px;
 +
}
 +
 +
 +
#site_title a {
 +
margin: 0px;
 +
padding: 0px;
 +
font-size: 30px;
 +
color: #ffffff;
 +
font-weight: bold;
 +
text-decoration: none;
 +
}
 +
 +
#site_title h1 a:hover {
 +
font-weight: bold;
 +
text-decoration: none;
 +
}
 +
 +
/* end of site title */
 +
 +
/* menu */
 +
 +
#temmplatmeo_header #templatemo_menu {
 +
float: right;
 +
padding-top: 53px;
 +
height: 43px;
 +
margin-right: 70px
 +
}
 +
 +
#templatemo_menu ul {
 +
margin: 0;
 +
padding: 0;
 +
list-style: none;
 +
}
 +
 +
#templatemo_menu ul li {
 +
padding: 0;
 +
margin: 0;
 +
display: inline;
 +
}
 +
 +
#templatemo_menu ul li a {
 +
position: relative;
 +
float: left;
 +
display: block;
 +
height: 33px;
 +
width: 123px;
 +
margin: 0 0 0 -20px;
 +
padding: 10px 0 0 20px;
 +
font-family: "Times New Roman", Times, serif;
 +
text-align: center;
 +
font-size: 16px;
 +
text-decoration: none;
 +
color: #fff;
 +
font-weight: normal;
 +
outline: none;
 +
background:url(https://static.igem.org/mediawiki/2012/e/e8/Templatemo_menu_button.png) no-repeat;
 +
}
 +
 +
#templatemo_menu li a:hover, #templatemo_menu li .current {
 +
z-index: 200;
 +
background:url(https://static.igem.org/mediawiki/2012/a/ad/Templatemo_menu_button_hover.png);
 +
}
 +
 +
/* end of menu */
 +
 +
/* banner */
 +
 +
#templatemo_banner {
 +
width: 954px;
 +
height: 236px;
 +
padding: 50px 35px;
 +
background: url(https://static.igem.org/mediawiki/2012/1/17/Templatemo_banner.png) no-repeat;
 +
}
 +
 +
#banner_left {
 +
float: left;
 +
width: 365px;
 +
color: #fff;
 +
text-align: justify;
 +
}
 +
 +
#banner_left h2 {
 +
font-size: 28px;
 +
font-weight: normal;
 +
margin-top: 0;
 +
}
 +
 +
#banner_left a {
 +
color: #1cc9c4;
 +
}
 +
 +
#banner_right {
 +
position: relative;
 +
float: right;
 +
width: 517px;
 +
height: 215px;
 +
padding: 9px;
 +
margin-right: 30px;
 +
overflow: hidden;
 +
}
 +
 +
#banner_right span {
 +
position: absolute;
 +
width: 535px;
 +
height: 233px;
 +
top: 0;
 +
left: 0;
 +
z-index: 800;
 +
background: url(https://static.igem.org/mediawiki/2012/6/62/Templatemo_banner_image_frame.png) no-repeat;
 +
}
 +
/* end of banner */
 +
 +
/* content */
 +
 +
#templatemo_content {
 +
 +
clear: both;
 +
width: 900px;
 +
padding: 35px 62px 15px 62px;
 +
background: url(https://static.igem.org/mediawiki/igem.org/8/89/Templatemo_content_bg.png) repeat-y center;
 +
}
 +
 +
#content_bottom {
 +
width: 1024px;
 +
height: 6px;
 +
background: url(images/templatemo_content_bottom.png) no-repeat;
 +
}
 +
 +
.float_l_img {
 +
float: left;
 +
margin: 3px 15px 5px 0;
 +
}
 +
 +
#templatemo_content h2 {
 +
color: #9ea0a1;
 +
font-weight: normal;
 +
font-size: 25px;
 +
margin: 0 0 25px 0;
 +
}
 +
 +
#templatemo_content p {
 +
margin-bottom: 6px;
 +
text-align: justify;
 +
}
 +
 +
#templatemo_content strong {
 +
color: #17aba6;
 +
font-weight: bold;
 +
}
 +
 +
#templatemo_content .services_list {
 +
margin: 20px 150px 0 0;
 +
padding: 0;
 +
list-style: none;
 +
}
 +
 +
#templatemo_content .services_list li {
 +
margin: 0 0 5px 0;
 +
padding: 4px 0 5px 15px;
 +
border-bottom: 1px dashed #c7c7c7;
 +
background: url(https://static.igem.org/mediawiki/igem.org/a/ac/List_icon.png) no-repeat center left;
 +
}
 +
 +
.section_w900 {
 +
clear: both;
 +
width: 900px;
 +
}
 +
 +
.section_w580 {
 +
width: 580px;
 +
}
 +
 +
.section_w280 {
 +
float: right;
 +
width: 280px;
 +
}
 +
 +
.services_section {
 +
clear: both;
 +
padding: 20px;
 +
background: url(https://static.igem.org/mediawiki/igem.org/3/3e/Templatemo_services.jpg) no-repeat top center;
 +
}
 +
 +
.testimonial {
 +
 +
height: 160px;
 +
padding: 60px 20px 20px 70px;
 +
margin-bottom: 30px;
 +
overflow: hidden;
 +
background:url(https://static.igem.org/mediawiki/igem.org/8/81/Templatemo_testimonial.png) no-repeat;
 +
text-align: justify;
 +
}
 +
 +
.twitter {
 +
width: 280px;
 +
height: 180px;
 +
overflow: hidden;
 +
background: url(https://static.igem.org/mediawiki/igem.org/a/a4/Templatemo_twitter.jpg) no-repeat center;
 +
text-align: justify;
 +
}
 +
 +
.twitter ul {
 +
margin: 0;
 +
padding: 70px 30px 30px 30px;
 +
list-style: none;
 +
}
 +
 +
.twitter ul li {
 +
margin: 0 0 10px 0;
 +
padding: 0;
 +
}
 +
 +
.twitter ul li span {
 +
clear: both;
 +
display: block;
 +
font-style: italic;
 +
color: #26aba7;
 +
}
 +
 +
.showcase {
 +
margin: 0;
 +
padding: 0;
 +
list-style: none;
 +
}
 +
 +
.showcase li {
 +
margin: 0;
 +
padding: 0;
 +
display: block;
 +
float: left;
 +
width: 180px;
 +
height: 196px;
 +
margin: 0 13px 12px 0;
 +
background: url(https://static.igem.org/mediawiki/igem.org/0/0d/Templatemo_portfolio_frame.jpg) no-repeat;
 +
}
 +
 +
.showcase li a {
 +
display: block;
 +
margin: 20px;
 +
text-decoration: none;
 +
}
 +
 +
.showcase li a img {
 +
margin-bottom: 5px;
 +
}
 +
 +
.showcase li a span {
 +
margin-top: 5px;
 +
color: #5e5e5e;
 +
font-weight: normal;
 +
}
 +
/* end of content */
 +
 +
/* footer */
 +
 +
#templatemo_footer {
 +
clear: both;
 +
width: 1000px;
 +
padding: 10px 12px;
 +
margin: 0 auto;
 +
color: #252525;
 +
text-align: center;
 +
}
 +
 +
#templatemo_footer a {
 +
font-weight: normal;
 +
color: #252525;
 +
text-decoration: underline;
 +
}
 +
 +
/* end of footer */
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +
</style>
 +
 +
 +
 +
 +
 +
 +
 +
</head>
 +
<body>
<div id="templatemo_wrapper">
<div id="templatemo_wrapper">
<div id="temmplatmeo_header">
<div id="temmplatmeo_header">
   <div id="site_title">
   <div id="site_title">
-
           <a href="http://www.templatemo.com" target="_parent">
+
           <a href="#" target="_parent">
-
             <img src="http://www.templatemo.com/templates/templatemo_195_scene/images/templatemo_logo.png" alt="Scene Template" />
+
             <img src="https://static.igem.org/mediawiki/igem.org/2/2f/Templatemo_logo.png" alt="Scene Template" />
             </a>
             </a>
         </div>
         </div>
Line 28: Line 479:
             <ul>
             <ul>
                 <li><a href="index.html" class="current">Home</a></li>
                 <li><a href="index.html" class="current">Home</a></li>
-
                 <li><a href="#">About</a></li>
+
                 <li><a href="#">About1</a></li>
 +
                <li><a href="#">About2</a></li>
                 <li><a href="portfolio.html">Portfolio</a></li>
                 <li><a href="portfolio.html">Portfolio</a></li>
                 <li><a href="#">Contact Us</a></li>
                 <li><a href="#">Contact Us</a></li>
Line 40: Line 492:
      
      
   <div id="banner_left">
   <div id="banner_left">
-
         <h2>Web Design</h2>
+
         <h2>SUSTC  TEAM</h2>
-
             <p>Vivamus a velit. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Curabitur quis velit quis tortor tincidunt aliquet. Vivamus leo velit, convallis id, ultrices sit amet, tempor a, libero.</p>
+
             <p>Vivamus a velit. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.  
 +
 
 +
Curabitur quis velit quis tortor tincidunt aliquet. Vivamus leo velit, convallis id, ultrices sit amet, tempor a,  
 +
 
 +
libero.</p>
             <p>&nbsp;</p>
             <p>&nbsp;</p>
-
             <p>Mauris quis nulla sed ipsum pretium sagittis. Suspendisse feugiat. Ut sodales libero ut odio. Maecenas venenatis metus eu est. In sed risus ac felis varius bibendum. Nulla imperdiet congue metus. Vestibulum dapibus tortor. <a href="#">Read More</a></p>
+
             <p>Mauris quis nulla sed ipsum pretium sagittis. Suspendisse feugiat. Ut sodales libero ut odio. Maecenas  
 +
 
 +
venenatis metus eu est. In sed risus ac felis varius bibendum. Nulla imperdiet congue metus. Vestibulum dapibus tortor.  
 +
 
 +
<a href="#">Read More</a></p>
   </div>
   </div>
          
          
Line 51: Line 511:
           <div class="cs_wrapper">
           <div class="cs_wrapper">
               <div class="cs_slider">
               <div class="cs_slider">
 +
               
 +
<!-- 图片幻灯片位置 --><!-- 图片幻灯片位置 --><!-- 图片幻灯片位置 --><!-- 图片幻灯片位置 --><!-- 图片幻灯片位置 -->
                  
                  
                   <div class="cs_article">
                   <div class="cs_article">
Line 69: Line 531:
                       </a>
                       </a>
                 </div>
                 </div>
 +
             
 +
 +
<!-- 图片幻灯片位置 --><!-- 图片幻灯片位置 --><!-- 图片幻灯片位置 --><!-- 图片幻灯片位置 --><!-- 图片幻灯片位置 -->
 +
<!-- 图片幻灯片位置 --><!-- 图片幻灯片位置 --><!-- 图片幻灯片位置 --><!-- 图片幻灯片位置 --><!-- 图片幻灯片位置 -->
 +
                
                
               </div><!-- End cs_slider -->
               </div><!-- End cs_slider -->
           </div><!-- End cs_wrapper -->
           </div><!-- End cs_wrapper -->
-
        </div><!-- End contentslider -->
 
-
<!-- Site JavaScript -->
+
 
 +
 
 +
<!-- Site JavaScript -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
-
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
+
<script type="text/javascript" src="http://www.templatemo.com/templates/templatemo_195_scene/js/jquery.easing.1.3.js"></script>
-
<script type="text/javascript" src="js/jquery.ennui.contentslider.js"></script>
+
 
 +
 
 +
<script type="text/javascript"src="http://www.templatemo.com/templates/templatemo_195_scene/js/jquery.ennui.contentslider.js">
 +
</script>
 +
 
 +
 
 +
 
<script type="text/javascript">
<script type="text/javascript">
$(function() {
$(function() {
Line 88: Line 562:
});
});
</script>
</script>
-
<script src="js/jquery.chili-2.2.js" type="text/javascript"></script>
+
<script src="http://www.templatemo.com/templates/templatemo_195_scene/js/jquery.chili-2.2.js" type="text/javascript"></script>
-
<script src="js/chili/recipes.js" type="text/javascript"></script>
+
<script src="http://www.templatemo.com/templates/templatemo_195_scene/js/chili/recipes.js" type="text/javascript"></script>
-
          
+
 
 +
         </div><!-- End contentslider -->
 +
 
 +
<!-- Site JavaScript -->
 +
     
       </div>  <!-- end of slider -->  
       </div>  <!-- end of slider -->  
Line 97: Line 575:
      
      
     </div> <!-- end of templatemo_banner -->
     </div> <!-- end of templatemo_banner -->
-
   
 
-
    <div id="templatemo_content">
 
-
   
 
-
    <div class="section_w900">
 
-
       
 
-
        <div class="section_w580 float_l">
 
-
           
 
-
              <h2>Scene Website Template</h2>
 
-
                <img src="http://www.templatemo.com/templates/templatemo_195_scene/images/templatemo_about.png" alt="image" class="float_l_img"/>
 
-
            <p>This website template comes with 2 pages (<a href="index.html">Home</a> and <a href="portfolio.html">Portfolio</a>). Credit goes to <a href="http://www.smashingmagazine.com" target="_blank">Smashing Magazine</a> for icons used in this template. Vivamus a velit. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Curabitur quis velit quis tortor tincidunt aliquet. </p>
 
-
  <p>Praesent varius egestas velit. Donec a massa ut pede pulvinar vulputate. Nulla et augue. Sed eu nunc quis pede tristique suscipit. Nam sit amet justo vel libero tincidunt dignissim. Cras magna velit, pellentesque mattis, faucibus vitae, feugiat vitae, sapien. Donec ante. Fusce ac orci sit amet velit ultrices condimentum. Integer imperdiet odio ac eros. Ut id massa. Nullam nunc. Vivamus sagittis varius lorem. <a href="#">More Details</a></p>
 
-
               
 
-
               
 
-
                <div class="cleaner_h40"></div>
 
-
               
 
-
                <div class="services_section">
 
-
                <h2>Web Design Ideas</h2>
 
-
               
 
-
                <p><strong>Aenean cursus. Maecenas aliquam,</strong> ligula id egestas suscipit, nisi sapien dignissim nibh, ac vestibulum lorem urna in neque. Aenean eget tortor eget ipsum aliquet porta. <a href="#">more</a>... </p>
 
-
               
 
-
                <ul class="services_list">
 
-
                <li><a href="#">Nulla suscipit erat ac odio, tumsemper etrhoncus wuam</a></li>
 
-
                  <li><a href="#">Pellentesque ullamcorper quam fringilla</a></li>
 
-
  <li><a href="#">Nullam dapibus laoreet magna.uspendisse tortor leo</a></li>
 
-
  <li><a href="#">Nulla suscipit erat ac odio. tumsemper etrhoncus wuam</a></li>
 
-
                </ul>
 
-
</div>
 
-
           
 
-
            </div> <!-- end of section_600 -->
 
-
           
 
-
            <div class="section_w280 float_r">
 
-
           
 
-
                <div class="testimonial">
 
-
                        <p><strong>Ut sodales libero ut</strong> Maecenas venenatis metus eu est. In sed risus acfelis varius bibendum. Nulla imperdiet congue metus.</p>
 
-
                        <p><strong>Vesibu lum dapibus</strong> tortor vel orci. Maecenas vulputate, arcu id fermentum eleifend, tortorenim tincidunt. [<a href="#">Read More</a>]</p>
 
-
                </div>
 
-
               
 
-
          <div class="twitter">
 
-
        <ul>
 
-
                    <li>malesuada fames ac turpis egestas.<span><a href="#">On Monday @ 16:20</a></span></li>
 
-
                <li>ligula id egestas suscipit.<span><a href="#">On Tuesday @ 13:48</a></span></li>
 
-
                  </ul>
 
-
                </div>
 
-
           
 
-
            </div>
 
-
       
 
-
        <div class="cleaner"></div>
 
-
        </div>
 
-
       
 
-
       
 
-
   
 
-
    </div><div id="content_bottom"></div> <!-- end of templatemo_content -->
 
-
   
 
-
    <div id="templatemo_footer">
 
-
    Copyright 漏 2048 <a href="#">Your Company Name</a> |
 
-
        Designed by <a href="http://www.templatemo.com" target="_parent">Free CSS Templates</a> |
 
-
        Validate <a href="http://validator.w3.org/check?uri=referer">XHTML</a> &amp; <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a>
 
-
    </div>
 
</div> <!-- end of templatemo_wrapper -->
</div> <!-- end of templatemo_wrapper -->
</body>
</body>
 +
</html>
</html>

Latest revision as of 14:30, 8 September 2012

************************