Difference between revisions of "Team:Tokyo-NoKoGen/Demo"

 
(12 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
{{TeamTokyoNokogen}}
 
{{TeamTokyoNokogen}}
{{Tokyo-Nokogenfooter}}
+
 
 
<html>
 
<html>
 
<style>
 
<style>
 
html, body{
 
html, body{
margin: 0; /* 余白の削除 */
+
 
padding: 0; /* 余白の削除 */
+
height:auto;
height: 100%; /* 縦の高さを100% */
+
margin-top:-10px;
width: 100%; /* 横の幅を100% */
+
padding:20px;
 +
background:#ffffff;
 +
        position:absolute;
 
}
 
}
 
div#wrap {
 
div#wrap {
Line 16: Line 18:
 
margin-left:auto;
 
margin-left:auto;
 
margin-right:auto;
 
margin-right:auto;
 +
 +
 
}
 
}
 
div#bannerContainer {
 
div#bannerContainer {
 
width:75%;
 
width:75%;
 
position:absolute;
 
position:absolute;
border:solid 1px;
+
 
 
         top:0px;
 
         top:0px;
  
Line 28: Line 32:
 
height:330px;
 
height:330px;
 
margin-top:-10px;
 
margin-top:-10px;
border:solid 1px;
+
 
 
         position:absolute;
 
         position:absolute;
 
         top:260px
 
         top:260px
Line 38: Line 42:
 
margin-top:10px;
 
margin-top:10px;
 
margin-left:10px;
 
margin-left:10px;
background:#ffffff;
+
background:#FFFFCC;
      border:solid 1px #000000;
+
     
 
display: inline-block; _display: inline;
 
display: inline-block; _display: inline;
 
float:left;
 
float:left;
Line 52: Line 56:
 
margin-top:10px;
 
margin-top:10px;
 
margin-left:20px;
 
margin-left:20px;
background:#ffffff;
+
background:#CCFF99;
      border:solid 1px #000000;
+
 
display: inline-block; _display: inline;
 
display: inline-block; _display: inline;
 
display: table-cell;    /* ④ */   
 
display: table-cell;    /* ④ */   
Line 68: Line 71:
 
margin-left:15px;
 
margin-left:15px;
 
margin-right:10px;
 
margin-right:10px;
background:#ffffff;
+
background:#91d176;
      border:solid 1px #000000;
+
 
       display: table-cell;   
 
       display: table-cell;   
 
               display: inline-block; _display: inline;
 
               display: inline-block; _display: inline;
Line 83: Line 85:
 
height:330px;
 
height:330px;
 
margin-top:-10px;
 
margin-top:-10px;
border:solid 1px;
+
 
 
         position:absolute;
 
         position:absolute;
       top:340px;
+
       top:330px;
 
       left:0px;
 
       left:0px;
 
}
 
}
Line 96: Line 98:
 
margin-top:10px;
 
margin-top:10px;
 
margin-left:20px;
 
margin-left:20px;
background:#ffffff;
+
background:#6b8bcd;
      border:solid 1px #000000;
+
 
display: inline-block; _display: inline;
 
display: inline-block; _display: inline;
 
display: table-cell;    /* ④ */   
 
display: table-cell;    /* ④ */   
Line 112: Line 113:
 
margin-top:300px;
 
margin-top:300px;
 
margin-left:20px;
 
margin-left:20px;
background:#ffffff;
+
background:#6b8bcd;
      border:solid 1px #000000;
+
 
display: inline-block; _display: inline;
 
display: inline-block; _display: inline;
 
display: table-cell;     
 
display: table-cell;     
Line 125: Line 125:
 
margin-top:-300px;
 
margin-top:-300px;
 
margin-right:10px;
 
margin-right:10px;
background: #ffffff;
+
background: #79d480;
      border:solid 1px #000000;
+
 
float:right;
 
float:right;
 
cursor:pointer;
 
cursor:pointer;
Line 133: Line 132:
 
width:900px;
 
width:900px;
 
height:180px;
 
height:180px;
margin-top:-19px;
+
margin-top:-25px;
border:solid 1px;
+
 
 
         position:absolute;
 
         position:absolute;
         top:350px
+
         top:330px
 
}
 
}
 +
 
.Ache {
 
.Ache {
 
width:210px;
 
width:210px;
 
height:150px;
 
height:150px;
 
margin-top:10px;
 
margin-top:10px;
margin-left:10px;
+
margin-left:12px;
background:#ffffff;
+
background:#71b4d0;
      border:solid 1px #000000;
+
 
display: inline-block; _display: inline;
 
display: inline-block; _display: inline;
 
float:left;
 
float:left;
Line 154: Line 153:
 
margin-top:10px;
 
margin-top:10px;
 
margin-left:10px;
 
margin-left:10px;
background:#ffffff;
+
background:#6ecec7;
      border:solid 1px #000000;
+
 
display: inline-block; _display: inline;
 
display: inline-block; _display: inline;
 
float:left;
 
float:left;
Line 165: Line 163:
 
margin-top:10px;
 
margin-top:10px;
 
margin-left:10px;
 
margin-left:10px;
background:#ffffff;
+
background:#7bd593;
      border:solid 1px #000000;
+
 
display: inline-block; _display: inline;
 
display: inline-block; _display: inline;
 
float:left;
 
float:left;
Line 177: Line 174:
 
margin-top:-5px;
 
margin-top:-5px;
 
margin-left:10px;
 
margin-left:10px;
background:#ffffff;
+
background:#7593d3;
      border:solid 1px #000000;
+
 
        display: inline-block; _display: inline;
 
        display: inline-block; _display: inline;
 
float:left;
 
float:left;
Line 192: Line 188:
 
h2 {
 
h2 {
 
     font-size:20px;
 
     font-size:20px;
     font-family:Georgia;
+
     font-family:fantasy;
 
     text-decoration:none;
 
     text-decoration:none;
 
   }
 
   }
Line 268: Line 264:
  
 
  <div class="overview">
 
  <div class="overview">
           <img src="http://junk-blog.com/wp-content/uploads/2014/09/sample_image.jpg" alt="サンプル画像" width="550" height="250"alt="Overview"/>
+
    <h2>Introduction</h2>
 +
        <!--   <img src="http://junk-blog.com/wp-content/uploads/2014/09/sample_image.jpg" alt="サンプル画像" width="550" height="250"alt="Overview"/>  -->
 
          
 
          
 
            <a href="https://2015.igem.org/Team:Tokyo-NoKoGen" target="_blank"></a></td>
 
            <a href="https://2015.igem.org/Team:Tokyo-NoKoGen" target="_blank"></a></td>
Line 276: Line 273:
 
    
 
    
 
  <div class="team">
 
  <div class="team">
 <p>team</p>
+
  <h2>Team</h2>
 <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Team" target="_blank" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7 ></a>
+
 <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Team" target="_blank" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7 ></a>
 
          </div>  
 
          </div>  
 
           
 
           
 
               <div class="notebook">
 
               <div class="notebook">
 <p>Notebook</p>
+
 <h2>Notebook</h2>
 
 <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Notebook" target="_blank" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7 ></a>
 
 <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Notebook" target="_blank" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7 ></a>
 
           </div>
 
           </div>
Line 289: Line 286:
 
<div id="box2"/*見えない2段目のボックス*/> 
 
<div id="box2"/*見えない2段目のボックス*/> 
 
<div class="facebook">
 
<div class="facebook">
           <p>facebook</p>
+
           <h2>facebook</h2>
 
          <a href="https://www.facebook.com/tokyo.nokogen" target="_blank"></a>
 
          <a href="https://www.facebook.com/tokyo.nokogen" target="_blank"></a>
 
            
 
            
 
     </div>
 
     </div>
 
     <div class="twitter">
 
     <div class="twitter">
           <p>twitter</p>
+
           <h2>twitter</h>
 
           <a href="https://twitter.com/iGEM_Nokogen" target="_blank"></a>
 
           <a href="https://twitter.com/iGEM_Nokogen" target="_blank"></a>
 
            
 
            
Line 300: Line 297:
 
     
 
     
 
      <div class="project">
 
      <div class="project">
         <p>project</p> 
+
         <h2>project</h2> 
 
         <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Description" target="_blank"></a>         
 
         <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Description" target="_blank"></a>         
 
      </div>
 
      </div>
Line 306: Line 303:
 
       <div id="box3"/*見えない3段目のボックス*/>  
 
       <div id="box3"/*見えない3段目のボックス*/>  
 
     <div class="Ache">
 
     <div class="Ache">
           <p>Achievement</p>
+
           <h2>Achievement</h2>
 
           <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/achievement" target="_blank"></a>  
 
           <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/achievement" target="_blank"></a>  
 
     </div>
 
     </div>
 
     <div class="Human">
 
     <div class="Human">
           <p>Human practice</p>
+
           <h2>Human practice</h2>
 
            <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Practices" target="_blank"></a>
 
            <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Practices" target="_blank"></a>
 
     </div>
 
     </div>
 
     <div class="parts">
 
     <div class="parts">
           <p>Parts</p>
+
           <h2>Parts</h2>
 
            <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Parts" target="_blank"></a>
 
            <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Parts" target="_blank"></a>
 
     </div>
 
     </div>
 
      <div class="safety">
 
      <div class="safety">
           <p>Safety</p>
+
           <h2>Safety</h2>
 
            <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Safety" target="_blank"></a>
 
            <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Safety" target="_blank"></a>
 
     </div>
 
     </div>
Line 394: Line 391:
  
  
 
+
/*footer*/
 
<style>
 
<style>
div#footer /*フッター*/ {
+
div#wrapper2 {
width:890px;
+
width:80%;
height:200px;
+
text-align:center;
border:solid 1px;
+
position:relative;
        position:absolute;
+
min-height:100%;
      bottom:0px;
+
margin-left:auto;
      margin:auto;
+
margin-right:auto;
 
+
 
}
 
}
 +
 +
 +
div#footer {
 +
    margin:0 auto;
 +
    position:absolute;
 +
    width:900px;
 +
 +
  left : -200px ;
 +
    bottom:-1300px;
 +
        }
 +
  
 
div#footer img {
 
div#footer img {
 
     width:200px;
 
     width:200px;
 
         }
 
         }
 
 
p {
 
p {
 
     font-size:16px;
 
     font-size:16px;
Line 417: Line 423:
 
h2 {
 
h2 {
 
     font-size:20px;
 
     font-size:20px;
     font-family:Georgia;
+
     font-family:fantasy;
 
     text-decoration:none;
 
     text-decoration:none;
 
   }
 
   }
#globalWrapper, #content {
+
</style>
width: 100%;
+
height: 100%;
+
border: 40px;
+
background-color: #E6FFE9;
+
margin: 0px;
+
padding: 0px;
+
font-size: 100%;
+
}
+
html, body, .wrapper {
+
width: 100%;
+
height: 100%;
+
background-color: #E6FFE9;
+
  
 
</style>
 
  
 
<body>
 
<body>
Line 452: Line 444:
 
</div>
 
</div>
 
</body>
 
</body>
 +
 +
/*footer*/
 
</html>
 
</html>

Latest revision as of 16:31, 8 September 2015

  
    
  

Introduction

                                  
       
 

Team

    
  
 

Notebook

    
            
      

project

                   
     
       

Achievement

          
  
       

Human practice

          
  
       

Parts

          
  
       

Safety

          
  
       
        
/*footer*/
/*footer*/