Team:TMU-Tokyo/practice

From 2012.igem.org

(Difference between revisions)
(Created page with "{{team:TMU-Tokyo/css}} <!DOCTYPE html> <html lang="en"> <body> <h1> <a href="http://960.gs/">960 Grid System</a> </h1> <div class="container_12"> <h2> 12 Column Grid </...")
 
(3 intermediate revisions not shown)
Line 1: Line 1:
{{team:TMU-Tokyo/css}}
{{team:TMU-Tokyo/css}}
-
<!DOCTYPE html>
 
<html lang="en">
<html lang="en">
-
<body>
+
 
 +
<head>
 +
<style type=text/css>
 +
 
 +
 
 +
 
 +
#p-logo { height:1px; overflow:hidden; display: none;}
 +
 
 +
#top-section {
 +
background-image: url('https://static.igem.org/mediawiki/2011/5/5e/Tokyo_Metropolitan_Header.png');
 +
height:80px  ! important;;
 +
}
 +
 
 +
</style>
 +
</head>
 +
 
<h1>
<h1>
   <a href="http://960.gs/">960 Grid System</a>
   <a href="http://960.gs/">960 Grid System</a>
Line 10: Line 24:
     12 Column Grid
     12 Column Grid
   </h2>
   </h2>
-
  <div class="grid_12">
+
 
-
    <p>
+
   <!---->
-
      940
+
-
    </p>
+
-
  </div>
+
-
   <!-- end .grid_12 -->
+
-
  <div class="clear"></div>
+
-
  <div class="grid_1">
+
-
    <p>
+
-
      60
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_1 -->
+
-
  <div class="grid_11">
+
-
    <p>
+
-
      860
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_11 -->
+
-
  <div class="clear"></div>
+
-
  <div class="grid_2">
+
-
    <p>
+
-
      140
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_2 -->
+
-
  <div class="grid_10">
+
-
    <p>
+
-
      780
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_10 -->
+
-
  <div class="clear"></div>
+
   <div class="grid_3">
   <div class="grid_3">
     <p>
     <p>
-
       220
+
       左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左
     </p>
     </p>
   </div>
   </div>
-
   <!-- end .grid_3 -->
+
    
-
  <div class="grid_9">
+
   <!--真ん中-->
-
    <p>
+
-
      700
+
-
    </p>
+
-
  </div>
+
-
   <!-- end .grid_9 -->
+
-
  <div class="clear"></div>
+
-
  <div class="grid_4">
+
-
    <p>
+
-
      300
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_4 -->
+
-
  <div class="grid_8">
+
-
    <p>
+
-
      620
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_8 -->
+
-
  <div class="clear"></div>
+
-
  <div class="grid_5">
+
-
    <p>
+
-
      380
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_5 -->
+
-
  <div class="grid_7">
+
-
    <p>
+
-
      540
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_7 -->
+
-
  <div class="clear"></div>
+
   <div class="grid_6">
   <div class="grid_6">
     <p>
     <p>
-
       460
+
       中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中
     </p>
     </p>
   </div>
   </div>
-
   <!-- end .grid_6 -->
+
 
-
   <div class="grid_6">
+
   <!--右(Widget等)-->
-
     <p>
+
   <div class="grid_3">
-
       460
+
     <script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
-
     </p>
+
<script>
 +
new TWTR.Widget({
 +
  version: 2,
 +
  type: 'profile',
 +
  rpp: 4,
 +
  interval: 30000,
 +
  width: 250,
 +
  height: 300,
 +
  theme: {
 +
    shell: {
 +
       background: '#333333',
 +
      color: '#ffffff'
 +
     },
 +
    tweets: {
 +
      background: '#000000',
 +
      color: '#ffffff',
 +
      links: '#4aed05'
 +
    }
 +
  },
 +
  features: {
 +
    scrollbar: false,
 +
    loop: false,
 +
    live: true,
 +
    behavior: 'all'
 +
  }
 +
}).render().setUser('igemtmu').start();
 +
</script>
   </div>
   </div>
-
  <!-- end .grid_6 -->
+
 
   <div class="clear"></div>
   <div class="clear"></div>
-
   <div class="grid_1 suffix_11">
+
    
-
    <p>
+
-
      60
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_1.suffix_11 -->
+
-
  <div class="clear"></div>
+
-
  <div class="grid_1 prefix_1 suffix_10">
+
-
    <p>
+
-
      60
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_1.prefix_1.suffix_10 -->
+
-
  <div class="clear"></div>
+
-
  <div class="grid_1 prefix_2 suffix_9">
+
-
    <p>
+
-
      60
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_1.prefix_2.suffix_9 -->
+
-
  <div class="clear"></div>
+
-
  <div class="grid_1 prefix_3 suffix_8">
+
-
    <p>
+
-
      60
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_1.prefix_3.suffix_8 -->
+
-
  <div class="clear"></div>
+
-
  <div class="grid_1 prefix_4 suffix_7">
+
-
    <p>
+
-
      60
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_1.prefix_4.suffix_7 -->
+
-
  <div class="clear"></div>
+
-
  <div class="grid_1 prefix_5 suffix_6">
+
-
    <p>
+
-
      60
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_1.prefix_5.suffix_6 -->
+
-
  <div class="clear"></div>
+
-
  <div class="grid_1 prefix_6 suffix_5">
+
-
    <p>
+
-
      60
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_1.prefix_6.suffix_5 -->
+
-
  <div class="clear"></div>
+
-
  <div class="grid_1 prefix_7 suffix_4">
+
-
    <p>
+
-
      60
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_1.prefix_7.suffix_4 -->
+
-
  <div class="clear"></div>
+
-
  <div class="grid_1 prefix_8 suffix_3">
+
-
    <p>
+
-
      60
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_1.prefix_8.suffix_3 -->
+
-
  <div class="clear"></div>
+
-
  <div class="grid_1 prefix_9 suffix_2">
+
-
    <p>
+
-
      60
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_1.prefix_9.suffix_2 -->
+
-
  <div class="clear"></div>
+
-
  <div class="grid_1 prefix_10 suffix_1">
+
-
    <p>
+
-
      60
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_1.prefix_10.suffix_1 -->
+
-
  <div class="clear"></div>
+
-
  <div class="grid_1 prefix_11">
+
-
    <p>
+
-
      60
+
-
    </p>
+
-
  </div>
+
-
  <!-- end .grid_1.prefix_11 -->
+
-
  <div class="clear"></div>
+
-
  <div class="grid_6 push_6">
+
-
    <div class="grid_1 alpha">
+
-
      <p>
+
-
        60
+
-
      </p>
+
-
    </div>
+
-
    <!-- end .grid_1.alpha -->
+
-
    <div class="grid_5 omega">
+
-
      <p>
+
-
        380
+
-
      </p>
+
-
    </div>
+
-
    <!-- end .grid_5.omega -->
+
-
    <div class="clear"></div>
+
-
    <div class="grid_3 alpha">
+
-
      <p>
+
-
        220
+
-
      </p>
+
-
    </div>
+
-
    <!-- end .grid_3.alpha -->
+
-
    <div class="grid_3 omega">
+
-
      <p>
+
-
        220
+
-
      </p>
+
-
    </div>
+
-
    <!-- end .grid_3.omega -->
+
-
  </div>
+
-
  <!-- end .grid_6.push_6 -->
+
-
  <div class="grid_6 pull_6">
+
-
    <div class="grid_3 alpha">
+
-
      <p>
+
-
        220
+
-
      </p>
+
-
    </div>
+
-
    <!-- end .grid_3.alpha -->
+
-
    <div class="grid_3 omega">
+
-
      <p>
+
-
        220
+
-
      </p>
+
-
    </div>
+
-
    <!-- end .grid_3.omega -->
+
-
    <div class="clear"></div>
+
-
    <div class="grid_1 alpha">
+
-
      <p>
+
-
        60
+
-
      </p>
+
-
    </div>
+
-
    <!-- end .grid_1.alpha -->
+
-
    <div class="grid_5 omega">
+
-
      <p>
+
-
        380
+
-
      </p>
+
-
    </div>
+
-
    <!-- end .grid_5.omega -->
+
-
  </div>
+
-
  <!-- end .grid_6.pull_6 -->
+
</div>
</div>
-
<!-- end .container_12 -->
 
-
</body>
 
</html>
</html>

Latest revision as of 03:00, 16 August 2012

960 Grid System

12 Column Grid

左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左左

中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中