Team:HKU-Hong Kong/3col

From 2010.igem.org

(Difference between revisions)
 
(15 intermediate revisions not shown)
Line 4: Line 4:
         .firstHeading {
         .firstHeading {
                 display:none;}
                 display:none;}
 +
/*---whole background---*/
 +
 +
        #globalWrapper{
 +
background:#aaaaaa url("https://static.igem.org/mediawiki/2010/4/45/Backigemhku.png");
 +
}
 +
-
body {
+
 
-
float:center; margin:0; padding:0;background: url("http://www.asia.ru/images/target/photo/50871720/Fishing_Net.jpg")center top fixed; width:100%; 
+
/*---whole content---*/
-
}
+
         #content{
         #content{
                 background: transparent;
                 background: transparent;
Line 14: Line 19:
                 border: none;   
                 border: none;   
             }
             }
-
 
+
/*---header n footer---*/
-
 
+
#header {
#header {
margin:0; padding:0;
margin:0; padding:0;
-
background:transparent;
+
background:#0c6;
}
}
         #footer {
         #footer {
margin:0; padding:0;
margin:0; padding:0;
-
background:#ffffff;filter:alpha(opacity=80);opacity:0.8;
+
background:#ffffff;
}
}
 +
/*---whole body?---*/
 +
    /*---whole, be seen as top + middle col (as in T)---*/
#main1 {
#main1 {
margin:0; padding:0;
margin:0; padding:0;
-
background:#ffffff;filter:alpha(opacity=60);opacity:0.6;
+
background:transparent url("https://static.igem.org/mediawiki/2010/8/88/Logosil.png")repeat-y center top;
}
}
 +
    /*---modifier:all lower columns||| (ref. 3col site )---*/
#main2 {
#main2 {
-
margin:0; padding:0;
+
margin:0; padding:0;background:transparent;filter:alpha(opacity=80);opacity:0.8;
-
background:url("blue.gif") top right repeat-y;
+
}
}
 +
/*---left col---*/
#left {
#left {
float:left;
float:left;
width:150px;
width:150px;
margin:0; padding:0;
margin:0; padding:0;
-
background:transparent;
+
background:transparent url(http://www.rickandandrea.com/andrea/wp-content/uploads/2009/10/heart-sand-love-michelle.jpg);
font-size:80%;
font-size:80%;
}
}
 +
/*---right col---*/
#right {
#right {
float:right;
float:right;
width:150px;
width:150px;
margin:0; padding:0;
margin:0; padding:0;
-
background:url("corner.gif") top right no-repeat;
+
background:transparent url(http://www.rickandandrea.com/andrea/wp-content/uploads/2009/10/heart-sand-love-michelle.jpg) top right;
font-size:80%;
font-size:80%;
}
}
 +
/*---middle col---*/
#middle {
#middle {
margin:0 150px;
margin:0 150px;
-
background:transparent;
+
background:#00ff00;
font-size:80%;
font-size:80%;
}
}
 +
.column-in {
.column-in {
margin:0; padding:0.5em 1em;
margin:0; padding:0.5em 1em;
Line 85: Line 95:
</head>
</head>
<body>
<body>
-
<div id="header"><div class="column-in">
+
<div id="header">
-
<h1>silicin's css testing page</h1>
+
<img src="https://static.igem.org/mediawiki/2010/thumb/0/06/Abcas.jpg/900px-Abcas.jpg" width="100%" height="113" style="opacity:1;filter:alpha(opacity=100)" alt="hku-igem logo"/>  
-
<img src="https://static.igem.org/mediawiki/2010/thumb/0/06/Abcas.jpg/900px-Abcas.jpg" width="95%" height="113" style="opacity:0.4;filter:alpha(opacity=40)" alt="hku-igem logo"/>  
+
</center><table border="0" align="center" style="background-color:#0c6" width="80%">
-
</div></div>
+
<tr>
 +
<td><center><a href="https://2010.igem.org/Team:HKU-Hong_Kong/">home</a></center></td>
 +
<td><center><a href="https://2010.igem.org/Team:HKU-Hong_Kong/Team">team</a></center></td>
 +
<td><center><a href="https://igem.org/Team.cgi?year=2010&team_name=HKU-Hong_Kong">official team profile</a></center></td>
 +
<td><center><a href="https://2010.igem.org/Team:HKU-Hong_Kong/Project">project</a></center></td>
 +
<td><center><a href="https://2010.igem.org/Team:HKU-Hong_Kong/Parts">parts</a></center></td>
 +
<td><center><a href="https://2010.igem.org/Team:HKU-Hong_Kong/Modeling">modeling</a></center></td>
 +
<td><center><a href="https://2010.igem.org/Team:HKU-Hong_Kong/Notebook">notebook</a></center></td>
 +
<td><center><a href="https://2010.igem.org/Team:HKU-Hong_Kong/Safety">safety</a></center></td>
 +
</tr>
 +
</table></center>
 +
</div>
 +
<div id="main1">
-
<div id="main1"><div id="main2">
+
<div id="main2">
<div id="left"><div class="column-in">
<div id="left"><div class="column-in">
Line 97: Line 119:
<h4>Left Col</h4>
<h4>Left Col</h4>
<p id="lccont">
<p id="lccont">
-
This is content of the LEFT column. It can be <a href="javascript:toggleContent('lccont',1)">short</a>, <a href="javascript:toggleContent('lccont',3)">longer</a> or <a href="javascript:toggleContent('lccont',10)">very long</a>.
+
This is content of the LEFT column. It can be <a href="javascript:toggleContent('lccont',1)">short</a>, <a href="javascript:toggleContent('lccont',3)">longer</a> or <a href="javascript:toggleContent('lccont',20)">very long</a>.
</p>
</p>
</div></div>
</div></div>
Line 106: Line 128:
This is content of the RIGHT column. It can be <a href="javascript:toggleContent('rccont',1)">short</a>, <a href="javascript:toggleContent('rccont',3)">longer</a> or <a href="javascript:toggleContent('rccont',10)">very long</a>.
This is content of the RIGHT column. It can be <a href="javascript:toggleContent('rccont',1)">short</a>, <a href="javascript:toggleContent('rccont',3)">longer</a> or <a href="javascript:toggleContent('rccont',10)">very long</a>.
</p>
</p>
-
 
</div></div>
</div></div>
Line 121: Line 142:
</div></div>
</div></div>
-
<div id="footer"><div class="column-in">
+
<div id="footer">
-
<h4>The footer</h4>
+
<img src="https://static.igem.org/mediawiki/2010/thumb/0/06/Abcas.jpg/900px-Abcas.jpg" width="100%" height="113" style="opacity:1;filter:alpha(opacity=100)" alt="hku-igem logo"/>  
-
<p>
+
</div>
-
Anything follows here...
+
-
</p>
+
-
 
+
-
</div></div>
+
</body>
</body>
</html>
</html>

Latest revision as of 07:19, 27 August 2010

Left Col

This is content of the LEFT column. It can be short, longer or very long.

Middle Col

This is content of the MIDDLE column. It can be short, longer or very long.