Team:KIT-Kyoto/kazukokekokko

From 2012.igem.org

(Difference between revisions)
m
m
Line 6: Line 6:
/* 段組み*/
/* 段組み*/
#my_body{margin:0 auto; width:1000px;border-left:1px solid #fff;border-right:1px solid #fff;}
#my_body{margin:0 auto; width:1000px;border-left:1px solid #fff;border-right:1px solid #fff;}
-
#my_navigation{float:left; width:190px; padding-left:10px; background-color:#eebbcb; padding-top:50px;}
+
#my_navigation{float:left; width:190px; padding-left:10px;; padding-top:50px;}
-
#my_contents{float:left;  width:790px; background-color:#eebbcb; padding-left:10px; padding-top:10px;}
+
#my_contents{float:left;  width:790px; ; padding-left:10px; padding-top:10px;}
-
 
+
-
/*ボックス*/
+
-
li{list-style:none;}
+
-
div.box1 {
+
-
width: 730px; /* ボックスの幅 */
+
-
height: 200px;
+
-
background-color:#FFFFFF; /* ボックスの背景色 */
+
-
border: 0px #999999 solid; /* ボックスの枠の太さと色 */
+
-
font-size: 90%; /* ボックス内の文字サイズを少し小さく指定 */
+
-
margin-bottom:20px;/*ボックスの下に少しスペースを空ける*/
+
-
}
+
-
div.box1 p {
+
-
margin-top: 15px;/*文字の上に少しスペースを空ける*/
+
-
margin-left: 10px;/*文字の左に少しスペースを空ける*/
+
-
}
+
-
.box1 p img{
+
-
float:left;/*文字が写真の右側に回り込むように指定*/
+
-
margin-top:10px;
+
-
margin-left:15px;/*写真の左にスペース*/
+
-
margin-right:30px; /*写真の右にスペース*/
+
-
border:solid 0px
+
-
}
+
-
/*ボックス2の設定*/
+
-
div.box2 {
+
-
width: 730px; /* ボックスの幅 */
+
-
height: 200px;
+
-
background-color:#FFFFFF; /* ボックスの背景色 */
+
-
border: 0px #999999 solid; /* ボックスの枠の太さと色 */
+
-
font-size: 90%; /* ボックス内の文字サイズを少し小さく指定 */
+
-
margin-bottom:20px;/*ボックスの下に少しスペースを空ける*/
+
-
}
+
-
div.box2 p {
+
-
margin-top: 15px;/*文字の上に少しスペースを空ける*/
+
-
margin-left: 25px;/*文字の左に少しスペースを空ける*/
+
-
}
+
-
.box2 p img{
+
-
float:right;/*文字が写真の右側に回り込むように指定*/
+
-
margin-top:10px;
+
-
margin-left:15px;/*写真の左にスペース*/
+
-
margin-right:30px; /*写真の右にスペース*/
+
-
border:solid 0px
+
-
}
+
-
div.box3 {
+
-
width: 730px; /* ボックスの幅 */
+
-
height: 200px;
+
-
background-color:#FFFFFF; /* ボックスの背景色 */
+
-
border: 0px #999999 solid; /* ボックスの枠の太さと色 */
+
-
font-size: 90%; /* ボックス内の文字サイズを少し小さく指定 */
+
-
margin-bottom:20px;/*ボックスの下に少しスペースを空ける*/
+
-
}
+
-
div.box3 p {
+
-
margin-top: 15px;/*文字の上に少しスペースを空ける*/
+
-
margin-left: 10px;/*文字の左に少しスペースを空ける*/
+
-
}
+
-
.box3 p img{
+
-
float:left;/*文字が写真の右側に回り込むように指定*/
+
-
margin-top:10px;
+
-
margin-left:15px;/*写真の左にスペース*/
+
-
margin-right:30px; /*写真の右にスペース*/
+
-
border:solid 0px
+
-
}
+
-
</style>
+
-
</head>
+
-
<!--段組み--!>
+
-
<body>
+
-
<div="REGULAR">
+
-
<div id="my_body">
+
-
<div id="my_navigation">
+
-
<div id="mynavi">
+
-
<ul>KIT-Kyoto2012
+
-
<a href="#Takaaki"><li>Takaaki TAKEDA</li></a>
+
-
<a href="#Shunji"><li>Shunji MATSUZAKI</li></a>
+
-
<a href="#Yu"><li>Yu TANAKA</li></a>
+
-
</ul>
+
-
</div>
+
-
</div>
+
-
 
+
-
<div id="my_contents">
+
-
<div id="mymain">
+
-
<font size="6">idea note</font>
+
-
スクラップみたいにしてみる？？？？
+
-
<div class="contents"><h2>PROFILE</h2>
+
-
<p></p></div>
+
-
<div id ="Takaaki" class="box1">
+
-
<p><img src="img/img1.jpg" title="TAKAAKI" width="150" height="150" class="css-hover" /></p>
+
-
<p><font size="4">Takaaki Takeda</font></p>
+
-
<p>detail<br />
+
-
<br />
+
-
</p>
+
-
</div>
+
-
<div id="Shunji" class="box2">
+
-
<p><img src="img/img1.jpg" title="SHUNJI" width="150" height="150" class="css-hover" /></p>
+
-
<p><font size="4">Shunji Matsuzaki</font></p>
+
-
<p>detail<br />
+
-
</p>
+
-
</div>
+
-
<div id ="Yu" class="box3">
+
-
<p><img src="img/img1.jpg" title="YU" width="150" height="150" class="css-hover" /></p>
+
-
<p><font size="4">Yu Tanaka</font></p>
+
-
<p>detail<br />
+
-
<br />
+
-
</p>
+
-
</div>
+
-
</div>
+
-
<!--まだ終わってないやつ--!>
+
-
<div class="slideshow">
+
-
        <img src=""alt="" />
+
-
        <img src="" alt="" class="alt" />
+
-
        <img src="" alt="" class="alt" />
+
-
</div>
+
-
<script style="text/css>
+
-
.slideshow{
+
-
      width:1000px;
+
-
      height:150px;
+
-
      margin:0 20px 20px 0;
+
-
      float:left;
+
-
      posithin:relative;
+
-
}
+
-
.slideshow img{
+
-
      position:absolute;
+
-
      top:0;
+
-
      left:0;
+
-
      border:1px solid #000
+
-
}
+
-
.slideshow img.alt{
+
-
      display:none;
+
-
}
+
-
</script>
+
-
<script style="javascript">
+
-
$(function(){
+
-
          var interval = 3000;
+
-
          $('.slideshow').each(function(){
+
-
                var container = $(this);
+
-
                function switchImg(){
+
-
                        var imgs = container.find('img);
+
-
                        var first =i img.eq(0);
+
-
                        var second = img.eq(1);
+
-
                        first.fadeOut().appendTo(container);
+
-
                        second.fadeIn();
+
-
                  }
+
-
                  setInterval(switchImg,interval);
+
-
          });
+
-
});
+
-
</script>
+
-
<head>
+
-
<style type="text/css">
+
ul.acc, ul.acc li ul {  
ul.acc, ul.acc li ul {  
   margin: 0;  
   margin: 0;  
Line 194: Line 48:
ul.acc1 li ul {  
ul.acc1 li ul {  
   background-color: none;  
   background-color: none;  
-
}  
+
}
-
</style>
+
-
 
+
-
<head>
+
-
<style type="text/css">
+
ul.acc, ul.acc li ul {  
ul.acc, ul.acc li ul {  
   margin: 0;  
   margin: 0;  
Line 243: Line 93:
}  
}  
</style>
</style>
-
 
<script type="text/javascript">  
<script type="text/javascript">  
var j$ = jQuery;  
var j$ = jQuery;  
Line 282: Line 131:
});  
});  
</script>  
</script>  
-
+
</head>
-
</head>  
+
<!--段組み--!>
-
+
<div="REGULAR">
-
<div id="REGULAR">
+
<div id="my_body">
 +
<div id="my_navigation">
 +
<div id="mynavi">
 +
KIT-Kyoto2012
 +
<br>
 +
TWITTER
 +
<br>
 +
Counter
 +
<br>
 +
などを配置する。
 +
</div>
 +
</div>
 +
 
 +
<div id="my_contents">
 +
<div id="mymain">
 +
<div class="contents">
 +
シンプルさ優先！アブスト、スポンサー、実験の概要の画像？？？？
 +
<br>
 +
↓Notebookのナビにはりつける用
 +
</div>
 +
</div>
<ul class="acc">  
<ul class="acc">  
   <li><a href=""><img src="" width="160" height="32" class="menu_head" />LAB NOTE</a>
   <li><a href=""><img src="" width="160" height="32" class="menu_head" />LAB NOTE</a>
Line 323: Line 192:
<a href=""><img src="" width="160" height="32" border="0" bordercolor="black">DESIGN NOTE</a>
<a href=""><img src="" width="160" height="32" border="0" bordercolor="black">DESIGN NOTE</a>
<BR>
<BR>
-
</div>
 
<br>
<br>
pfofile ex.<A href="https://2012.igem.org/Team:KIT-Kyoto/Team-Kazuko" >いちいち押すやつ</A>
pfofile ex.<A href="https://2012.igem.org/Team:KIT-Kyoto/Team-Kazuko" >いちいち押すやつ</A>
Line 335: Line 203:
</div>
</div>
</div>
</div>
-
</body>
+
</div>  
</html>
</html>

Revision as of 11:29, 23 August 2012




KIT-Kyoto2012
TWITTER
Counter
などを配置する。
シンプルさ優先！アブスト、スポンサー、実験の概要の画像？？？？
↓Notebookのナビにはりつける用
PROTOCOL
DESIGN NOTE

pfofile ex.いちいち押すやつ
見出し go
日本の伝統色

Retrieved from "http://2012.igem.org/Team:KIT-Kyoto/kazukokekokko"