Team:KIT-Kyoto/Template/header

From 2012.igem.org

(Difference between revisions)
m
m
Line 10: Line 10:
--!>
--!>
</style>
</style>
 +
<ul id="pulldown-menu">
 +
<font face="MS ゴシック">
 +
<li><a href="https://2012.igem.org/Team:KIT-Kyoto">HOME</a>
 +
</li>
-
<!--めにゅー--!>
+
<li><a href="">ABOUT US</a>
-
<body>
+
    <ul>
-
<div id="menu">
+
    <li><a href="https://2012.igem.org/Team:KIT-Kyoto/Profile">PROFILE</a></li>
-
   <ul style="list-style:none">
+
    <li><a href="http://twitter.com/KITKyoto12">TWITTER</a></li>
-
      <li><a href="https://2012.igem.org/Team:KIT-Kyoto">HOME</a>
+
    <li><a href="">YouTube</a></li>
-
      </li>
+
    <li><a href="https://2012.igem.org/Team:KIT-Kyoto/Photos">PHOTOS</a></li>
-
      <li><a href="">About Us</a>
+
     </ul>
-
          <ul style="list-style:none">
+
</li>
-
               <li><a href="https://2012.igem.org/Team:KIT-Kyoto/Team">Profile</a></li>
+
-
               <li><a href="https://2012.igem.org/Team:KIT-Kyoto/Photo">Photos</a></li>
+
-
              <li><a href="http://www.twitter.com/KITKyoto12">Twitter</a></li>
+
-
              <li><a href="">YouTube</a></li>
+
-
          </ul>
+
-
       </li>
+
-
       <li><a href="https://2012.igem.org/Team:KIT-Kyoto/Project">Project</a>
+
-
          <ul style="list-style:none">
+
-
               <li><a href="">a</a></li>
+
-
               <li><a href="">b</a></li>
+
-
               <li><a href="">c</a></li>
+
-
              <li><a href="">d</a></li>
+
-
          </ul>
+
-
       </li>
+
-
       <li><a href="https://2012.igem.org/Team:KIT-Kyoto/Parts">Parts</a>
+
-
            <ul style="list-style:none">
+
-
              <li><a href="">e</a></li>
+
-
              <li><a href="">f</a></li>
+
-
              <li><a href="">g</a></li>
+
-
            </ul>
+
-
        <li><a href="https://2012.igem.org/Team:KIT-Kyoto/Modeling">Modeling</a>
+
-
            <ul style="list-style:none">
+
-
                <li><a href="">h</a></li>
+
-
                <li><a href="">i</a></li>
+
-
                <li><a href="">j</a></li>
+
-
              </ul>
+
-
        <li><a href="https://2012.igem.org/Team:KIT-Kyoto/Notebook">Notebook</a>
+
-
              <ul style="list-style:none">     
+
-
                <li><a href="">k</a></li>
+
-
                <li><a href="">l</a></li>
+
-
                <li><a href="">m</a></li>
+
-
                </ul>
+
-
        <li><a href="https://2012.igem.org/Team:KIT-Kyoto/Safety">Safety</a>
+
-
              <ul style="list-style:none">   
+
-
                  <li><a href="">n</a></li>
+
-
                  <li><a href="">o</a></li>
+
-
                  <li><a href="">p</a></li>
+
-
                </ul>
+
-
        <li><a href="">Humanpractice</a>
+
-
                <ul style="list-style:none"> 
+
-
                    <li><a href="">q</a></li>
+
-
                    <li><a href="">r</a></li>
+
-
                    <li><a href="">s</a></li>
+
-
                  </ul>
+
-
        <li><a href="https://2012.igem.org/Team:KIT-Kyoto/Attributions">Attributions</a>
+
-
              <ul style="list-style:none">     
+
-
                  <li><a href="">t</a></li>
+
-
                  <li><a href="">u</a></li>
+
-
                  <li><a href="">v</a></li>
+
-
                </ul>
+
-
        <li><a href="https://2012.igem.org/Team:KIT-Kyoto/Sponsors">Sponsors</a>
+
-
        </li>
+
-
    </ul>
+
-
</div>
+
-
<!--デザイン、あとは左から１列に並べるのと色合わせ、リンク作り。--!>
+
<li><a href="https://2012.igem.org/Team:KIT-Kyoto/Project">PROJECT</a>
-
<style type="text/css">
+
    <ul>
-
<!--
+
    <li><a href="">OVERVIEW</a></li>
-
/* メインメニュー */
+
    <li><a href="">INTRODUCTION</a></li>
 +
    <li><a href="">RESULTS</a></li>
 +
    </ul>
 +
</li>
-
#menu ul {
+
<li><a href="https://2012.igem.org/Team:KIT-Kyoto/Parts>PARTS</a>
-
   display:block;
+
</li>
-
   list-style-type: none;
+
-
   margin:0;
+
-
   padding:0;
+
-
  text-align: center;
+
-
}
+
-
/* サブメニュー1段目 */
+
<li><a href="https://2012.igem.org/Team:KIT-Kyoto/Notebook">NOTEBOOK</a>
-
#menu ul ul{
+
    <ul>
-
   display:none;
+
    <li><a href="">LAB NOTE</a></li>
-
   position:absolute;
+
    <li><a href="">MEETING</a></li>
-
   top:100%;
+
    <li><a href="">PROTOCOL</a></li>
-
   text-align: center;
+
    <li><a href="">DESIGN NOTE</a></li>
-
　margin:0;
+
    </ul>
-
   padding:0;}
+
</li>
-
#menu ul ul ul{
+
-
   display:none;
+
-
   position:absolute;
+
-
   top:100%;
+
-
   text-align: center;
+
-
}
+
-
#menu ul ul ul ul{
+
-
   display:none;
+
-
   position:absolute;
+
-
   top:100%;
+
-
   text-align: center;
+
-
}
+
 +
<li><a href="https://2012.igem.org/Team:KIT-Kyoto/Safety">SAFETY</a>
 +
</li>
-
/* リスト */
+
<li><a href="">HUMANPRACTICE</a>
-
#menu li {
+
</li>
-
   float:left;line-height:2.0em;
+
</font>
-
   text-align: center;
+
</ul>
-
   background:#ddd;
+
<br><br><br>
 +
<!--NAKAMI--!>
 +
<style type="text/css">
 +
<!--
 +
ul#pulldown-menu a {
 +
        color:#5a544b ;
 +
        text-decoration: none;
 +
        }
 +
ul#pulldown-menu a:link,
 +
ul#pulldown-menu a:visited {
 +
        background:#c4a3bf ;
}
}
-
 
+
ul#pulldown-menu a:hover,
-
#menu li li {
+
ul#pulldown-menu a:active {
-
   clear:both;text-align: left;
+
        background: #b44c97 ;
}
}
-
#menu li:hover {
+
ul#pulldown-menu li {
-
   position:relative;
+
        float: left;
-
}
+
        position: relative;
 +
        margin: 0;
 +
        width: 9em;
 +
        height: 2em;
 +
        font-weight: bold;
 +
        line-height:2em;
 +
        list-style:none;
-
#menu li:hover > ul {
 
-
   display: block
 
}
}
-
/* IE6用 */
+
ul#pulldown-menu li a {
-
* html #menu li {
+
        display: block;
-
  behavior: expression(
+
        width: 9.5em;
-
      this.onmouseover=new Function("this.className='column1'"),
+
        height: 2em;
-
      this.onmouseout=new Function("this.className=''"),
+
        text-align: center;
-
      this.style.behavior = 'none'
+
       
-
  );
+
}
}
-
* html #menu li li {
+
/* 下層のメニューを不可視に */
-
  behavior: expression(
+
ul#pulldown-menu li ul {
-
      this.onmouseover=new Function("this.className='column2'"),
+
        display: none;
-
      this.onmouseout=new Function("this.className=''"),
+
-
      this.style.behavior = 'none'
+
-
  );
+
-
}
+
-
* html #menu li li li {
+
-
  behavior: expression(
+
-
      this.onmouseover=new Function("this.className='column2'"),
+
-
      this.onmouseout=new Function("this.className=''"),
+
-
      this.style.behavior = 'none'
+
-
  );
+
-
}
+
-
* html #menu li li li li {
+
-
  behavior: expression(
+
-
      this.onmouseover=new Function("this.className='column2'"),
+
-
      this.onmouseout=new Function("this.className=''"),
+
-
      this.style.behavior = 'none'
+
-
  );
+
-
}
+
-
* html #menu li li li li li li {
+
-
  behavior: expression(
+
-
      this.onmouseover=new Function("this.className='column2'"),
+
-
      this.onmouseout=new Function("this.className=''"),
+
-
      this.style.behavior = 'none'
+
-
  );
+
-
}
+
-
* html #menu li li li li li li li {
+
-
  behavior: expression(
+
-
      this.onmouseover=new Function("this.className='column2'"),
+
-
      this.onmouseout=new Function("this.className=''"),
+
-
      this.style.behavior = 'none'
+
-
  );
+
-
}
+
-
* html #menu li li li li li li li li li {
+
-
  behavior: expression(
+
-
      this.onmouseover=new Function("this.className='column2'"),
+
-
      this.onmouseout=new Function("this.className=''"),
+
-
      this.style.behavior = 'none'
+
-
  );
+
-
}
+
-
* html #menu li li li li li li li li li li {
+
-
  behavior: expression(
+
-
      this.onmouseover=new Function("this.className='column2'"),
+
-
      this.onmouseout=new Function("this.className=''"),
+
-
      this.style.behavior = 'none'
+
-
  );
+
}
}
-
 
+
/* 疑似要素 :hover で下層のメニューを可視に */
-
#menu .column1 {position:relative;}
+
ul#pulldown-menu li:hover ul {
-
#menu .column1 ul {display:block;}
+
        display: block;
-
#menu .column1 * ul {display:none;}
+
        position: absolute;
-
 
+
        z-index: 100;
-
#menu .column2 {position:relative;}
+
-
#menu .column2 ul {display:block;}
+
-
#menu .column2 * ul {display:none;}
+
-
 
+
-
/* デザイン */
+
-
#menu li {
+
-
  line-height:3.0em;
+
-
  text-align: center;
+
-
  background:#ee827c;
+
-
  border-radius: 20px;
+
-
  -moz-border-radius: 20px;
+
-
  -webkit-border-radius: 20px;
+
-
}
+
-
 
+
-
#menu li li {
+
-
  text-align: center;
+
-
  border-radius: 20px;
+
-
  -moz-border-radius: 20px;
+
-
  -webkit-border-radius: 20px;
+
-
}
+
-
 
+
-
#menu li a{
+
-
  display: block;
+
-
  width:100px;
+
-
  text-decoration:none;
+
-
  color:#5a544b;
+
-
  padding:0 20px;
+
-
}
+
-
/*hove=マウスオン*/
+
-
#menu li:hover {
+
-
  background:#e4ab9b;
+
-
  color:#5a544b;
+
}
}
-
#menu .column1, #menu .column2 {
+
ul#pulldown-menu li ul li {
-
  color:#5a544b;
+
        float: none;
-
  background:#ee827c;
+
        margin: 0;
 +
        font-weight: normal;
}
}
--!>
--!>
</style>
</style>
-
</body>
 
</head>
</head>
</html>
</html>

Revision as of 15:28, 15 July 2012




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