Template:Template ZJU-China 2010

From 2010.igem.org

(Difference between revisions)
Line 1: Line 1:
-
<html>
+
@charset "utf-8";
-
<head>
+
/* CSS Document */
-
<style type="text/css">
+
body {
body {
-
margin: 20px 0;
+
-
background: #FFFFFF;
+
font-family: Verdana, Arial, Helvetica, sans-serif;
-
font: normal small Georgia, "Times New Roman", Times, serif;
+
font-size: 12px;
-
color: #FFFFFF;
+
line-height: 24px;
-
}
+
-
 
+
-
h1, h2, h3 {
+
-
}
+
-
 
+
-
h2 {
+
-
color: #609;
+
-
}
+
-
 
+
-
h3 {
+
-
color: #60C;
+
-
}
+
-
 
+
-
p, blockquote, ul, ol {
+
-
}
+
-
 
+
-
p {
+
-
color: #63F;
+
-
}
+
-
 
+
-
blockquote {
+
-
margin-left: 3em;
+
-
}
+
-
 
+
-
ul {
+
-
margin-left: 3em;
+
-
}
+
-
 
+
-
ul li {
+
-
}
+
-
 
+
-
ol {
+
-
margin-left: 3em;
+
-
}
+
-
 
+
-
ol li {
+
}
}
a {
a {
-
color: #3366FF;
+
color:#009;
}
}
-
a:hover {
+
td, th {
-
text-decoration: none;
+
font-family: Verdana, Arial, Helvetica, sans-serif;
-
color: #FF6600;  
+
font-size: 12px;
 +
line-height: 24px;
 +
}
}
-
img {
+
img{
 +
border:0px;
}
}
-
/* Boxed Style */
+
#header {
-
 
+
width:1000px;
-
.boxed {
+
height:250px;
 +
overflow:hidden;
}
}
-
.boxed .title {
+
#headlogo {
-
padding: 5px 10px;
+
float:left;
-
background: url(https://static.igem.org/mediawiki/2010/e/e2/Img07.gif) repeat-x left bottom;
+
width: 269px;
-
font-size: 1em;
+
height: 250px;
}
}
-
.boxed .cont {
+
#headline {
-
padding: 20px 20px 40px 20px;
+
float:left;
-
}
+
/*padding-top:30px;
-
 
+
text-align:center;*/
-
/* Post */
+
height: 250px;
 +
width: 703px;
 +
}
-
.post {
+
#main{
-
padding: 10px;
+
width:1024px;
 +
height:1000px;
}
}
-
.post .title {
+
#menubar {
-
margin-bottom: 20px;
+
-
}
+
-
 
+
-
.post .story {
+
-
clear: both;
+
-
}
+
-
 
+
-
.post .story p, .post .story blockquote, .post .story ul, .post .story ol {
+
-
margin-bottom: 0.1em;
+
-
line-height: 180%;
+
-
}
+
-
 
+
-
/* Logo */
+
-
 
+
-
#logo {
+
-
width: 969px;
+
-
height: 210px;
+
-
margin: 0 auto;
+
-
}
+
-
 
+
-
#logo h1 {
+
float: left;
float: left;
-
width: 180px;
+
font-size:20px;
-
height: 160px;
+
font-stretch:expanded;
-
padding: 20px;
+
-
background: #FFB46A url(https://static.igem.org/mediawiki/2010/1/14/Img01.gif) no-repeat;
+
width: 269px;
-
text-align: right;
+
height: 800px;
-
font-size: 2.2em;
+
-
        color: #FFFFFF;
+
}
}
-
#logo h2 {
+
#menubar1{
-
float: right;
+
width:227px;
-
width: 699px;
+
height:58px;
-
height: 150px;
+
background-image:url(menubar1.jpg);
-
padding: 30px 20px 20px 20px;
+
background-repeat:no-repeat;
-
background: #319595 url(https://static.igem.org/mediawiki/2010/9/99/Img02.png) no-repeat;
+
text-align:center;
-
font-size: 1.4em;
+
line-height:55px;
}
}
-
#logo a {
+
#menubar2{
-
text-decoration: none;
+
width:227px;
-
color: #FFFFFF;
+
height:58px;
 +
background-image:url(menubar2.jpg);
 +
background-repeat:no-repeat;
 +
text-align:center;
 +
line-height:55px;
}
}
-
/* Content */
+
#menubar3{
-
 
+
width:227px;
-
#cont {
+
height:58px;
-
width: 965px;
+
background-image:url(menubar3.jpg);
-
margin: 0 auto;
+
background-repeat:no-repeat;
-
background: url(https://static.igem.org/mediawiki/2010/a/a0/Img03.png) repeat-y;
+
text-align:center;
 +
line-height:55px;
}
}
-
#extra {
+
#menubar4{
-
clear: both;
+
width:227px;
-
height: 20px;
+
height:58px;
-
background: url(https://static.igem.org/mediawiki/2010/5/51/Img06.png) no-repeat;
+
background-image:url(menubar4.jpg);
 +
background-repeat:no-repeat;
 +
text-align:center;
 +
line-height:55px;
}
}
-
/* Content > Main */
+
#menubar5{
-
 
+
width:227px;
-
#main {
+
height:58px;
-
float: right;
+
background-image:url(menubar5.jpg);
-
width: 738px;
+
background-repeat:no-repeat;
-
background: url(https://static.igem.org/mediawiki/2010/b/b0/Img05.gif) no-repeat right top;
+
text-align:center;
-
color: #FFA954;
+
line-height:55px;
}
}
-
#main a {
+
#main_content {
-
color: #FF7F00;
+
padding-left:5px;
-
}
+
padding-top:5px;
-
 
+
-
/* Content > Main > Welcome */
+
-
 
+
-
#welcome {
+
-
}
+
-
 
+
-
/* Content > Main > Example */
+
-
 
+
-
#example {
+
-
}
+
-
 
+
-
/* Content > Sidebar */
+
-
 
+
-
#side {
+
float: left;
float: left;
-
width: 220px;
+
overflow: auto;
-
background: url(https://static.igem.org/mediawiki/2010/a/a5/Img04.gif) no-repeat;
+
overflow-x: hidden;
-
color: #6BB3B3;
+
width:700px;
-
}
+
height: 800px;
-
 
+
-
#side a {
+
-
color: #319595;
+
-
}
+
-
 
+
-
/* Content > Sidebar > Menu */
+
-
 
+
-
#menu {
+
-
padding: 20px 0;
+
-
}
+
-
 
+
-
#menu ul {
+
-
margin: 0;
+
-
list-style: none;
+
-
}
+
-
 
+
-
#menu li {
+
-
display: block;
+
-
padding-bottom: 1px;
+
-
background: url(images/img07.gif) repeat-x left bottom;
+
-
}
+
-
 
+
-
 
+
-
 
+
-
#menu a {
+
-
display: block;
+
-
width: 170px;
+
-
padding: 10px 20px 10px 30px;
+
-
text-decoration: none;
+
-
}
+
-
 
+
-
#menu a:hover, #menu .active a {
+
-
background: #CDE5E5 url(https://static.igem.org/mediawiki/2010/1/11/Img08.gif) no-repeat 10px 50%;
+
-
}
+
-
 
+
-
/* Content > Sidebar > Updates*/
+
-
 
+
-
#updates {
+
-
}
+
-
 
+
-
#updates ul {
+
-
margin: 0;
+
-
list-style: none;
+
-
}
+
-
 
+
-
#updates h2 {
+
-
color: #6BB3B3;
+
-
}
+
-
 
+
-
#updates h3 {
+
-
color: #6BB3B3;
+
-
margin: 0;
+
-
font: bold x-small Verdana, Arial, Helvetica, sans-serif;
+
-
}
+
-
 
+
-
#updates p {
+
-
margin-bottom: 1.4em;
+
-
font-size: smaller;
+
-
line-height: normal;
+
-
}
+
-
 
+
-
 
+
-
 
+
-
/* Footer > Legal */
+
-
 
+
-
#legal {
+
-
}
+
-
 
+
-
/* Footer > Links */
+
-
 
+
-
#links {
+
-
}
+
-
</style>
+
-
</head>
+
-
 
+
-
<!-- ############################# BODY!!!!! #################################### -->
+
-
<body>
+
-
<div id="logo">
+
-
<h1><br>iGEM2010</h1>
+
-
<h2 align="center"><br><a href="#">Team: ZJU-China</a><br><br>
+
-
<a href="http://www.zju.edu.cn/english/">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Zhejiang University</a></h2>
+
-
</div>
+
-
<div id="cont">
+
-
<div id="side">
+
-
<div id="menu">
+
-
<ul>
+
-
<li id="mainHome" class="active"><a href="#" title="">Home</a></li>
+
-
  <li id="mainProjects"><a href="#" title="">Projects</a></li>
+
-
                  <ul>
+
-
                    <li><a href="#">Introduction</li>
+
-
                    <li><a href="#">Methods</li>
+
-
                    <li><a href="#">Results</li>
+
-
                    <li><a href="#">Discussion</li>
+
-
                    <li><a href="#">Outlook</li>
+
-
                    <li><a href="#">References</li>
+
-
                    <li><a href="#">Acknowledgements</li>
+
-
                  </ul>
+
-
              <li id="mainParts"><a href="#" title="">Parts</a></li>
+
-
  <li id="mainNotebook"><a href="#" title="">Notebook</a></li>
+
-
  <li id="mainCalender"><a href="#" title="">Calender</a></li>
+
-
  <li id="mainTeam"><a href="#" title="">Team</a></li>
+
-
                  <ul>
+
-
                    <li><a href="#">overview</li>
+
-
                    <li><a href="#">Instructors</li>
+
-
                    <li><a href="#">Advisors</li>
+
-
                    <li><a href="#">Students</li>
+
-
                    <li><a href="#">Labs</li>
+
-
                    <li><a href="#">Gallery</li>
+
-
                  </ul>
+
-
<li id="Sponsors"><a href="#" title="">Sponsors</a></li>
+
-
</ul>
+
-
</div>
+
-
<div id="updates" class="boxed">
+
-
<h2 class="title">Recent Updates</h2>
+
-
<div class="content">
+
-
<ul>
+
-
<li>
+
-
<h3>Jul 16, 2010</h3>
+
-
<p><a href="#">Upload the decriptions of our projects.</a></p>
+
-
</li>
+
-
                                        <li>
+
-
<h3>Aug 1, 2010</h3>
+
-
<p><a href="#">Change the style of team wiki.</a></p>
+
-
</li>
+
-
</ul>
+
-
</div>
+
-
</div>
+
-
                <div id="siteinfo" align="center">
+
-
                      <a href="http://www2.clustrmaps.com/counter/maps.php?url=https://2010.igem.org/Team:ZJU-China" id="clustrMapsLink"><img src="http://www2.clustrmaps.com/counter/index2.php?url=https://2010.igem.org/Team:ZJU-China" style="border:0px;" alt="Locations of visitors to this page" title="Locations of visitors to this page" id="clustrMapsImg" onerror="this.onerror=null; this.src='http://clustrmaps.com/images/clustrmaps-back-soon.jpg'; document.getElementById('clustrMapsLink').href='http://clustrmaps.com';" /></a>
+
-
              </div>
+
-
    </div>
+
-
<script type="text/javascript">
+
-
window.onload = function() {
+
-
      var lis = document.getElementsByTagName('li');
+
-
      for(i = 0; i < lis.length; i++) {
+
-
            var li = lis[i];
+
-
            if (li.id == 'mainTeam' || li.id == 'mainProjects' || li.id == 'mainParts' || li.id == 'mainNotebook' || li.id == 'mainCalender' || li.id == 'mainTeam' || li.id == 'mainSponsors') {
+
-
                  li.onmouseover = function() { this.getElementsByTagName('ul').item(0).style.display = 'block'; }
+
-
                  li.onmouseout = function() { this.getElementsByTagName('ul').item(0).style.display = 'none'; }
+
-
            }
+
-
      }
+
}
}
-
</script>
 
-
</body>
 

Revision as of 03:54, 26 August 2010

@charset "utf-8"; /* CSS Document */

body {

font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; line-height: 24px;

}

a { color:#009; }

td, th { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; line-height: 24px;

}

img{ border:0px; }

  1. header {

width:1000px; height:250px; overflow:hidden; }

  1. headlogo {

float:left; width: 269px; height: 250px; }

  1. headline {

float:left; /*padding-top:30px; text-align:center;*/ height: 250px; width: 703px; }

  1. main{

width:1024px; height:1000px; }

  1. menubar {

float: left; font-size:20px; font-stretch:expanded;

width: 269px; height: 800px; }

  1. menubar1{

width:227px; height:58px; background-image:url(menubar1.jpg); background-repeat:no-repeat; text-align:center; line-height:55px; }

  1. menubar2{

width:227px; height:58px; background-image:url(menubar2.jpg); background-repeat:no-repeat; text-align:center; line-height:55px; }

  1. menubar3{

width:227px; height:58px; background-image:url(menubar3.jpg); background-repeat:no-repeat; text-align:center; line-height:55px; }

  1. menubar4{

width:227px; height:58px; background-image:url(menubar4.jpg); background-repeat:no-repeat; text-align:center; line-height:55px; }

  1. menubar5{

width:227px; height:58px; background-image:url(menubar5.jpg); background-repeat:no-repeat; text-align:center; line-height:55px; }

  1. main_content {

padding-left:5px; padding-top:5px; float: left; overflow: auto; overflow-x: hidden; width:700px; height: 800px;

}