Team:Paris/Sandbox
From 2008.igem.org
(Difference between revisions)
(38 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
- | {{ | + | <html> |
- | -- | + | <style type="text/css"> |
+ | |||
+ | #header { | ||
+ | height: 150px; | ||
+ | background: url(https://static.igem.org/mediawiki/2008/4/4c/Panoramique.jpg) no-repeat center; | ||
+ | } | ||
+ | |||
+ | #menu { | ||
+ | background: url(https://static.igem.org/mediawiki/2008/5/58/Gradient.png); | ||
+ | } | ||
+ | |||
+ | #menu ul { | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | list-style: none; | ||
+ | text-align: center; | ||
+ | } | ||
+ | |||
+ | #menu li { | ||
+ | display: inline; | ||
+ | } | ||
+ | |||
+ | #menu li a { | ||
+ | padding: 4px 20px; | ||
+ | font: 2em "Trebuchet MS",Arial,sans-serif; | ||
+ | text-decoration: none; | ||
+ | /* | ||
+ | text-align: center; | ||
+ | color: black; | ||
+ | background: #c00; | ||
+ | border: 1px solid #600; | ||
+ | line-height: 1em; | ||
+ | */ | ||
+ | } | ||
+ | |||
+ | #menu li a:hover, #menu li a:focus, #menu li a:active { | ||
+ | color:white; | ||
+ | background: blue; | ||
+ | text-decoration: underline; | ||
+ | } | ||
+ | |||
+ | #menu a:after { | ||
+ | background: url(https://static.igem.org/mediawiki/2008/4/41/Arrow.png) no-repeat; | ||
+ | content: ""; | ||
+ | padding: 0 25px 0 0; | ||
+ | /*height: 25px; width: 25px;*/ | ||
+ | } | ||
+ | |||
+ | #menu li:last-child a:after { | ||
+ | width: 0; | ||
+ | padding: 0; | ||
+ | background: none; | ||
+ | } | ||
+ | |||
+ | pre {font-size: 1.2em} | ||
+ | span.keyword {color: #0000FF} | ||
+ | span.comment {color: #228B22} | ||
+ | span.string {color: #A020F0} | ||
+ | span.untermstring {color: #B20000} | ||
+ | span.syscmd {color: #B28C00} | ||
+ | } | ||
+ | |||
+ | </style> | ||
+ | |||
+ | <script type="text/javascript"> | ||
+ | function toggleElement(layer){ | ||
+ | var myLayer = document.getElementById(layer); | ||
+ | if(myLayer.style.display=="none"){ | ||
+ | myLayer.style.display="block"; | ||
+ | myLayer.backgroundPosition="top"; | ||
+ | } else { | ||
+ | myLayer.style.display="none"; | ||
+ | } | ||
+ | } | ||
+ | </script> | ||
+ | |||
+ | <div align="center"> | ||
+ | <div id="header"></div><br /> | ||
+ | <div id="menu"> | ||
+ | <ul> | ||
+ | <li><a href="#">Project</a></li> | ||
+ | <li><a href="#">Design</a></li> | ||
+ | <li><a href="#">Construction</a></li> | ||
+ | <li><a href="#">Results</a></li> | ||
+ | <li><a href="#">Characterization</a></li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | </html> | ||
+ | <br /> | ||
+ | {|cellspacing="5" cellpadding="10" style="background:#649CD7; width: 965px;" | ||
+ | |-valign="top" | ||
+ | |style="background:#ffffff"| | ||
+ | |||
+ | <html> | ||
+ | <style> | ||
+ | #links { | ||
+ | float: right; | ||
+ | margin: 1em; | ||
+ | border: dotted 1px #69c; | ||
+ | width: 13em; | ||
+ | background: #fff; | ||
+ | } | ||
+ | </style> | ||
+ | <div id="links"> | ||
+ | <ul> | ||
+ | <li><a href="https://2008.igem.org/Team:Paris/Analysis/page1">Page 1</a></li> | ||
+ | <li><a href="https://2008.igem.org/Team:Paris/Analysis/page2">Page 2</a></li> | ||
+ | <li><a href="https://2008.igem.org/Team:Paris/Analysis/page3">Page 3</a></li> | ||
+ | <li><a href="https://2008.igem.org/Team:Paris/Analysis/page4">Page 4</a></li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | <script> | ||
+ | function showTocToggle() { | ||
+ | if (document.createTextNode) { | ||
+ | var linkHolder = document.getElementById("toctitle"); | ||
+ | if (!linkHolder) { | ||
+ | return; | ||
+ | } | ||
+ | var outerSpan = document.createElement("span"); | ||
+ | outerSpan.className = "toctoggle"; | ||
+ | var toggleLink = document.createElement("a"); | ||
+ | toggleLink.id = "togglelink"; | ||
+ | toggleLink.className = "internal"; | ||
+ | toggleLink.href = "javascript:toggleToc()"; | ||
+ | toggleLink.appendChild(document.createTextNode(tocHideText)); | ||
+ | outerSpan.appendChild(document.createTextNode("[")); | ||
+ | outerSpan.appendChild(toggleLink); | ||
+ | outerSpan.appendChild(document.createTextNode("]")); | ||
+ | linkHolder.appendChild(document.createTextNode(" ")); | ||
+ | linkHolder.appendChild(outerSpan); | ||
+ | var cookiePos = document.cookie.indexOf("hidetoc="); | ||
+ | <!--if (cookiePos > -1 && document.cookie.charAt(cookiePos + 8) == 1) { | ||
+ | toggleToc(); | ||
+ | }--> | ||
+ | } | ||
+ | } | ||
+ | </html> | ||
+ | |||
+ | |||
+ | http://css.alsacreations.com/Construction-de-menus-en-CSS/Faire-un-menu-avec-onglets-en-CSS-avec-before-after | ||
+ | |||
+ | __TOC__ | ||
+ | |||
+ | |||
+ | =A= | ||
+ | ==Aa== | ||
+ | ==Ab== | ||
+ | =B= | ||
+ | =C= | ||
+ | =D= | ||
+ | ==Da== | ||
+ | ==Db== | ||
+ | ===Db1=== | ||
+ | ===Db2=== | ||
+ | ===Db3=== | ||
+ | =E= |
Latest revision as of 07:29, 30 October 2008
AAaAbBCDDaDbDb1Db2Db3E |