Template:Valencia09iGEM65
From 2009.igem.org
(Difference between revisions)
(New page: AA) |
|||
Line 1: | Line 1: | ||
- | + | <center><html> | |
+ | <style> | ||
+ | |||
+ | |||
+ | |||
+ | /*-----------------------------------------------------------------------------------------------*/ | ||
+ | div.MenuBar ul li ul.DropDownMenu { | ||
+ | display: none; /* Hides all drop-down menus. */ | ||
+ | |||
+ | } | ||
+ | /* | ||
+ | li:hover works in IE7 and FF2. | ||
+ | a:hover works in IE6 and FF2. | ||
+ | a:hover breaks li:hover in FF2. | ||
+ | */ | ||
+ | div.MenuBar ul li:hover ul.DropDownMenu li ul.SideMenu, | ||
+ | div.MenuBar ul li a:hover ul.DropDownMenu li a ul.SideMenu { | ||
+ | display: none; /* Hides all side menus. */ | ||
+ | } | ||
+ | /*------------------------------------------------------------------------------------- Menu Bar */ | ||
+ | |||
+ | div.MenuBar { | ||
+ | font: arial, verdana, sans-serif; | ||
+ | height: 41px; | ||
+ | width: 588px; | ||
+ | /*width: 100%;*/ | ||
+ | margin: 0; | ||
+ | border-top: 0; | ||
+ | border-right: 0; | ||
+ | border-left: 0; | ||
+ | padding: 0; | ||
+ | background: #2b3238; | ||
+ | |||
+ | } | ||
+ | |||
+ | div.MenuBar ul { | ||
+ | font: arial, verdana, sans-serif; | ||
+ | text-align: center; | ||
+ | list-style-type: none; | ||
+ | margin: 0.5em auto; | ||
+ | border: 0; | ||
+ | padding: 0; | ||
+ | background: #2b3238; | ||
+ | } | ||
+ | div.MenuBar ul li { | ||
+ | font: arial, helvetica, sans-serif; | ||
+ | display: block; | ||
+ | padding: 0; | ||
+ | margin: 0; | ||
+ | font-size: 1.3em; | ||
+ | float: left; | ||
+ | background: #2b3238; | ||
+ | text-align: center; | ||
+ | width: 107px; | ||
+ | position: relative; /* Sets the positioning context for each drop-down menu. */ | ||
+ | } | ||
+ | |||
+ | div.MenuBar ul li a { | ||
+ | font: arial, helvetica, sans-serif; | ||
+ | display: block; | ||
+ | background: #000000; | ||
+ | height: 22px; /* Keep height + padding-top + padding-bottom sync with the menu bar height. */ | ||
+ | color: #000000; | ||
+ | padding-top: 4px; | ||
+ | padding-bottom: 4px; | ||
+ | padding-left: 1em; /* Sets the left space between top-level items. */ | ||
+ | padding-right: 1em; /* Sets the right space between top-level items. */ | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | /*------------------------------------------------------------------------------ Drop-Down Menus */ | ||
+ | div.MenuBar ul li:hover ul.DropDownMenu, | ||
+ | div.MenuBar ul li a:hover ul.DropDownMenu { | ||
+ | display: block; | ||
+ | width: 7.5em; /* Drop-down menu width. | ||
+ | Use MenuTailor.css to customize. */ | ||
+ | height: 1em; | ||
+ | padding: 1px; /* Sets the drop-down menu "effective border" width. */ | ||
+ | position: absolute; | ||
+ | top: 23px; /* Places the drop-down menu under the menu bar. | ||
+ | Keep it sync with the menu bar height. */ | ||
+ | left: 0; /* Aligns the drop-down menu to its top-level item. */ | ||
+ | background-color: #2b3238; /* Selected item. */ | ||
+ | color: red; | ||
+ | |||
+ | } | ||
+ | div.MenuBar ul li:hover ul.DropDownMenu li a, | ||
+ | div.MenuBar ul li a:hover ul.DropDownMenu li a { | ||
+ | width: 7.5em; /* Keep it sync with the drop-down menu width. | ||
+ | Use MenuTailor.css to customize. */ | ||
+ | height: 1em; | ||
+ | padding-left: 0; | ||
+ | padding-right: 0; | ||
+ | background-color: #2b3238; /* Selected item. */ | ||
+ | color: red; | ||
+ | } | ||
+ | ul.DropDownMenu li a span { | ||
+ | display: block; | ||
+ | padding-left: 0.25em; /* Sets the left space of each drop-down menu item. */ | ||
+ | padding-right: 0.25em; /* Sets the right space of each drop-down menu item. */ | ||
+ | text-align: right; /* Aligns the >> symbol to the right. */ | ||
+ | } | ||
+ | ul.DropDownMenu li a span span { | ||
+ | float: left; /* Aligns the text (back) to the left. */ | ||
+ | font: 12px arial, helvetica, sans-serif; /* Required for IE55. */ | ||
+ | height: 20px; | ||
+ | color: red; | ||
+ | } | ||
+ | /*----------------------------------------------------------------------------------- Side Menus */ | ||
+ | div.MenuBar ul li:hover ul.DropDownMenu li:hover ul.SideMenu, | ||
+ | div.MenuBar ul li a:hover ul.DropDownMenu li a:hover ul.SideMenu { | ||
+ | display: block; | ||
+ | width: 10.5em; /* Side menu width. | ||
+ | Use MenuTailor.css to customize. */ | ||
+ | height: 1.25em; | ||
+ | padding: 2px; /* Sets the side menu "effective border" width. */ | ||
+ | position: absolute; | ||
+ | top: -7.5px; /* Aligns the side menu to its drop-down menu item. | ||
+ | Keep it sync with the side menu "effective border" width. */ | ||
+ | left: 9.75em; /* Places the side menu to the right of the drop-down menu. | ||
+ | Keep it sync with the drop-down menu width. | ||
+ | Use MenuTailor.css to customize. */ | ||
+ | } | ||
+ | div.MenuBar ul li:hover ul.DropDownMenu li:hover ul.SideMenu li a, | ||
+ | div.MenuBar ul li a:hover ul.DropDownMenu li a:hover ul.SideMenu li a { | ||
+ | width: 10.5em; /* Keep it sync with the side menu width. | ||
+ | Use MenuTailor.css to customize. */ | ||
+ | height: 1.25em; | ||
+ | font: 12px arial, helvetica, sans-serif; /* Required for IE55. */ | ||
+ | left: 9.75em; /* Places the side menu to the right of the drop-down menu. | ||
+ | Keep it sync with the drop-down menu width. | ||
+ | Use MenuTailor.css to customize. */ | ||
+ | } | ||
+ | div.MenuBar ul li ul.DropDownMenu li ul.SideMenu li a span { | ||
+ | padding-left: 0.5em; /* Sets the left space of each side menu item. */ | ||
+ | padding-right: 0.1em; /* Sets the right space of each side menu item. */ | ||
+ | text-align: left; | ||
+ | font: 12px arial, helvetica, sans-serif; /* Required for IE55. */ | ||
+ | left: 9.75em; /* Places the side menu to the right of the drop-down menu. | ||
+ | Keep it sync with the drop-down menu width. | ||
+ | Use MenuTailor.css to customize. */ | ||
+ | } | ||
+ | /*----------------------------------------------------------------------------- Browser Specific */ | ||
+ | * html div.MenuBar { | ||
+ | position: relative; /* For IE55 and IE6. | ||
+ | Hidden (* html) from non-IE browsers. */ | ||
+ | } | ||
+ | * html div.MenuBar ul li a { | ||
+ | float: left; /* For IE55 and IE6. | ||
+ | Breaks O9. | ||
+ | Hidden (* html) from non-IE browsers. */ | ||
+ | } | ||
+ | * html ul.DropDownMenu li a:hover { | ||
+ | cursor: hand; /* For IE55. | ||
+ | Hidden (* html) from non-IE browsers. */ | ||
+ | } | ||
+ | ul.DropDownMenu li a:hover { | ||
+ | cursor: pointer; /* For IE6 and IE7. | ||
+ | Hidding it (* html) from non-IE browsers breaks IE7! */ | ||
+ | } | ||
+ | * html div.MenuBar a:hover { | ||
+ | text-decoration: none; /* For IE55 and IE6. | ||
+ | Hidden (* html) from non-IE browsers. */ | ||
+ | } | ||
+ | * html div.MenuBar ul li table, | ||
+ | * html div.MenuBar ul li table td { | ||
+ | border: 0px none; /* For IE55 and IE6. | ||
+ | Hidden (* html) from non-IE browsers. */ | ||
+ | } | ||
+ | /*------------------------------------------------------------------------------- Default Colors */ | ||
+ | div.MenuBar { | ||
+ | background-color: Menu; | ||
+ | border-bottom: 1px solid ButtonShadow; | ||
+ | } | ||
+ | div.MenuBar a { | ||
+ | background-color: Menu; /* Top-level unselected items. */ | ||
+ | color: red; | ||
+ | } | ||
+ | div.MenuBar ul li:hover a, | ||
+ | div.MenuBar ul li a:hover { | ||
+ | color:red; | ||
+ | background-color: Highlight; /* Top-level selected item. */ | ||
+ | color: red; | ||
+ | } | ||
+ | /*...............................................................................................*/ | ||
+ | div.MenuBar ul li:hover ul.DropDownMenu, | ||
+ | div.MenuBar ul li a:hover ul.DropDownMenu { | ||
+ | background-color: ButtonShadow; /* Sets the drop-down menu "effective border" color. */ | ||
+ | } | ||
+ | div.MenuBar ul li:hover ul.DropDownMenu li a, | ||
+ | div.MenuBar ul li a:hover ul.DropDownMenu li a { | ||
+ | background-color: Menu; Drop-down menu unselected items. | ||
+ | Sets the drop-down menu "effective background" color. */ | ||
+ | color: red; | ||
+ | } | ||
+ | div.MenuBar ul li:hover ul.DropDownMenu li:hover a, | ||
+ | div.MenuBar ul li a:hover ul.DropDownMenu li a:hover { | ||
+ | background-color: Highlight; /* Drop-down menu selected item. */ | ||
+ | color: red; | ||
+ | } | ||
+ | /*...............................................................................................*/ | ||
+ | div.MenuBar ul li:hover ul.DropDownMenu li:hover ul.SideMenu, | ||
+ | div.MenuBar ul li a:hover ul.DropDownMenu li a:hover ul.SideMenu { | ||
+ | background-color: ButtonShadow; /* Sets the side menu "effective border" color. */ | ||
+ | } | ||
+ | div.MenuBar ul li:hover ul.DropDownMenu li:hover ul.SideMenu li a, | ||
+ | div.MenuBar ul li a:hover ul.DropDownMenu li a:hover ul.SideMenu li a { | ||
+ | background-color: Menu; /* Side menu unselected items. | ||
+ | Sets the side menu "effective background" color. */ | ||
+ | color: red; | ||
+ | } | ||
+ | div.MenuBar ul li:hover ul.DropDownMenu li:hover ul.SideMenu li a:hover, | ||
+ | div.MenuBar ul li a:hover ul.DropDownMenu li a:hover ul.SideMenu li a:hover { | ||
+ | background-color: Highlight; /* Side menu selected item. */ | ||
+ | color: red; | ||
+ | } | ||
+ | /*-----------------------------------------------------------------------------------------------*/ | ||
+ | /*Script-Free 3-Level Menu 1.2 Tailor | ||
+ | www.CesarDaniel.info | ||
+ | /*-------------------------------------------------------------------------------------- General */ | ||
+ | body { | ||
+ | background: white; | ||
+ | color: #2b3238; | ||
+ | margin: 0; | ||
+ | border: 0; | ||
+ | padding: 0; | ||
+ | } | ||
+ | |||
+ | |||
+ | div.MenuBar { | ||
+ | font: 13px arial, helvetica, sans-serif; | ||
+ | } | ||
+ | div.MenuBar ul { | ||
+ | font: 13px arial, helvetica, sans-serif; /* Required for IE55. */ | ||
+ | } | ||
+ | /*--------------------------------------------------------------------------------------- Colors */ | ||
+ | div.MenuBar { | ||
+ | background-color: #B0B0B0; /* Selected item. */ | ||
+ | color: red; | ||
+ | border-bottom: 1px solid ButtonShadow; | ||
+ | } | ||
+ | div.MenuBar a, | ||
+ | div.MenuBar ul li:hover ul.DropDownMenu li a, | ||
+ | div.MenuBar ul li a:hover ul.DropDownMenu li a, | ||
+ | div.MenuBar ul li:hover ul.DropDownMenu li:hover ul.SideMenu li a, | ||
+ | div.MenuBar ul li a:hover ul.DropDownMenu li a:hover ul.SideMenu li a { | ||
+ | background-color: red; /* Selected item. */ | ||
+ | color: red; | ||
+ | } | ||
+ | div.MenuBar ul li:hover a, | ||
+ | div.MenuBar ul li a:hover, | ||
+ | div.MenuBar ul li:hover ul.DropDownMenu li:hover a, | ||
+ | div.MenuBar ul li a:hover ul.DropDownMenu li a:hover, | ||
+ | div.MenuBar ul li:hover ul.DropDownMenu li:hover ul.SideMenu li a:hover, | ||
+ | div.MenuBar ul li a:hover ul.DropDownMenu li a:hover ul.SideMenu li a:hover { | ||
+ | background-color: red; /* Selected item. */ | ||
+ | color: #24006B; | ||
+ | } | ||
+ | div.MenuBar ul li:hover ul.DropDownMenu, | ||
+ | div.MenuBar ul li a:hover ul.DropDownMenu, | ||
+ | div.MenuBar ul li:hover ul.DropDownMenu li:hover ul.SideMenu, | ||
+ | div.MenuBar ul li a:hover ul.DropDownMenu li a:hover ul.SideMenu { | ||
+ | background-color: #FFFFFF; /* Sets the drop-down and side menus "effective border" color. */ | ||
+ | } | ||
+ | /*--------------------------------------------------------------------------------------- Widths */ | ||
+ | /* | ||
+ | |||
+ | /* | ||
+ | Menu Bar 1 | ||
+ | Drop-Down Menu #2 | ||
+ | */ | ||
+ | div.MenuBar#navi ul li:hover ul.DropDownMenu#MB1-DDM4, | ||
+ | div.MenuBar#navi ul li a:hover ul.DropDownMenu#MB1-DDM4, | ||
+ | div.MenuBar#navi ul li:hover ul.DropDownMenu#MB1-DDM4 li a, | ||
+ | div.MenuBar#navi ul li a:hover ul.DropDownMenu#MB1-DDM4 li a { | ||
+ | width: 11em; /* Drop-down menu width. */ | ||
+ | } | ||
+ | div.MenuBar#navi ul li:hover ul.DropDownMenu#MB1-DDM5, | ||
+ | div.MenuBar#navi ul li a:hover ul.DropDownMenu#MB1-DDM5, | ||
+ | div.MenuBar#navi ul li:hover ul.DropDownMenu#MB1-DDM5 li a, | ||
+ | div.MenuBar#navi ul li a:hover ul.DropDownMenu#MB1-DDM5 li a { | ||
+ | width: 12em; /* Drop-down menu width. */ | ||
+ | } | ||
+ | |||
+ | /*...............................................................................................*/ | ||
+ | /* | ||
+ | Menu Bar 1 | ||
+ | Drop-Down Menu #2 | ||
+ | Side Menu #1 | ||
+ | */ | ||
+ | div.MenuBar#navi ul li:hover ul.DropDownMenu li:hover ul.SideMenu#MB1-DDM2-SM1, | ||
+ | div.MenuBar#navi ul li a:hover ul.DropDownMenu li a:hover ul.SideMenu#MB1-DDM2-SM1 { | ||
+ | left: 15.5em !important; /* Places the side menu to the right of the drop-down menu. | ||
+ | Keep it sync with the drop-down menu width. */ | ||
+ | } | ||
+ | div.MenuBar#navi ul li:hover ul.DropDownMenu li:hover ul.SideMenu#MB1-DDM2-SM1, | ||
+ | div.MenuBar#navi ul li a:hover ul.DropDownMenu li a:hover ul.SideMenu#MB1-DDM2-SM1, | ||
+ | div.MenuBar#navi ul li:hover ul.DropDownMenu li:hover ul.SideMenu#MB1-DDM2-SM1 li a, | ||
+ | div.MenuBar#navi ul li a:hover ul.DropDownMenu li a:hover ul.SideMenu#MB1-DDM2-SM1 li a { | ||
+ | width: 10em; /* Side menu width. */ | ||
+ | } | ||
+ | /*...............................................................................................*/ | ||
+ | /* | ||
+ | Menu Bar 1 | ||
+ | Drop-Down Menu #2 | ||
+ | Side Menu #2 | ||
+ | */ | ||
+ | div.MenuBar#navi ul li:hover ul.DropDownMenu li:hover ul.SideMenu#MB1-DDM2-SM2, | ||
+ | div.MenuBar#navi ul li a:hover ul.DropDownMenu li a:hover ul.SideMenu#MB1-DDM2-SM2 { | ||
+ | left: 15.5em !important; /* Places the side menu to the right of the drop-down menu. | ||
+ | Keep it sync with the drop-down menu width. */ | ||
+ | } | ||
+ | div.MenuBar#navi ul li:hover ul.DropDownMenu li:hover ul.SideMenu#MB1-DDM2-SM2, | ||
+ | div.MenuBar#navi ul li a:hover ul.DropDownMenu li a:hover ul.SideMenu#MB1-DDM2-SM2, | ||
+ | div.MenuBar#navi ul li:hover ul.DropDownMenu li:hover ul.SideMenu#MB1-DDM2-SM2 li a, | ||
+ | div.MenuBar#navi ul li a:hover ul.DropDownMenu li a:hover ul.SideMenu#MB1-DDM2-SM2 li a { | ||
+ | width: 10em; /* Side menu width. */ | ||
+ | } | ||
+ | /*...............................................................................................*/ | ||
+ | /* | ||
+ | Menu Bar 1 | ||
+ | Drop-Down Menu #2 | ||
+ | Side Menu #3 | ||
+ | */ | ||
+ | div.MenuBar#navi ul li:hover ul.DropDownMenu li:hover ul.SideMenu#MB1-DDM2-SM3, | ||
+ | div.MenuBar#navi ul li a:hover ul.DropDownMenu li a:hover ul.SideMenu#MB1-DDM2-SM3 { | ||
+ | left: 15.5em !important; /* Places the side menu to the right of the drop-down menu. | ||
+ | Keep it sync with the drop-down menu width. */ | ||
+ | } | ||
+ | div.MenuBar#navi ul li:hover ul.DropDownMenu li:hover ul.SideMenu#MB1-DDM2-SM3, | ||
+ | div.MenuBar#navi ul li a:hover ul.DropDownMenu li a:hover ul.SideMenu#MB1-DDM2-SM3, | ||
+ | div.MenuBar#navi ul li:hover ul.DropDownMenu li:hover ul.SideMenu#MB1-DDM2-SM3 li a, | ||
+ | div.MenuBar#navi ul li a:hover ul.DropDownMenu li a:hover ul.SideMenu#MB1-DDM2-SM3 li a { | ||
+ | width: 10em; /* Side menu width. */ | ||
+ | } | ||
+ | /*...............................................................................................*/ | ||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | <body> | ||
+ | |||
+ | <div class='MenuBar' id="navi"> | ||
+ | <ul> | ||
+ | <li> | ||
+ | <a href="https://2009.igem.org/Team:Valencia" style="font-weight: bold; background: url(https://static.igem.org/mediawiki/2009/0/09/Bg2.gif)">Home | ||
+ | <!--[if gt IE 6]><!--></a><!--<![endif]--> | ||
+ | <!--[if lt IE 7]><table border="0" cellpadding="0" cellspacing="0"><tr><td><![endif]--> | ||
+ | <!--[if lte IE 6]></td></tr></table></a><![endif]--> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="https://2009.igem.org/Team:Valencia/TeamVal" style="font-weight: bold; background: url(https://static.igem.org/mediawiki/2009/0/09/Bg2.gif)">Team<!-- | ||
+ | [if gt IE 6]><!--></a><!--<![endif]--> | ||
+ | <!--[if lt IE 7]><table border="0" cellpadding="0" cellspacing="0"><tr><td><![endif]--> | ||
+ | <!--[if lte IE 6]></td></tr></table></a><![endif]--> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="https://2009.igem.org/Team:Valencia/Project" style="font-weight: bold; background: url(https://static.igem.org/mediawiki/2009/0/09/Bg2.gif)">Project<!--[if gt IE 6]><!--></a><!--<![endif]--> | ||
+ | <!--[if lt IE 7]><table border="0" cellpadding="0" cellspacing="0"><tr><td><![endif]--> | ||
+ | <!--[if lte IE 6]></td></tr></table></a><![endif]--> | ||
+ | </li> | ||
+ | |||
+ | <li> | ||
+ | |||
+ | <a href="https://2009.igem.org/Team:Valencia/Notebook" style="font-weight: bold; background: url(https://static.igem.org/mediawiki/2009/0/09/Bg2.gif)">Notebook | ||
+ | <!--[if gt IE 6]><!--></a><!--<![endif]--> | ||
+ | <!--[if lt IE 7]><table border="0" cellpadding="0" cellspacing="0"><tr><td><![endif]--> | ||
+ | <!--[if lte IE 6]></td></tr></table></a><![endif]--> | ||
+ | </li> | ||
+ | <li style="width: 160px"> | ||
+ | <a href="https://2009.igem.org/Team:Valencia/Human" style="font-weight: bold; background: url(https://static.igem.org/mediawiki/2009/0/09/Bg2.gif)">Human Practice<!--[if gt IE 6]><!--></a><!--<![endif]--> | ||
+ | <!--[if lt IE 7]><table border="0" cellpadding="0" cellspacing="0"><tr><td><![endif]--> | ||
+ | <!--[if lte IE 6]></td></tr></table></a><![endif]--> | ||
+ | </li> | ||
+ | |||
+ | |||
+ | </ul> | ||
+ | |||
+ | </div> | ||
+ | </body> | ||
+ | </html> | ||
+ | </center> |