»
EnglishFrenchVietnamese

Print - CSS Tabbed Menu - JavaScriptBank.com

Full version: jsB@nk » CSS » Horizontal menu » CSS Tabbed Menu
URL: https://www.javascriptbank.com/css-tabbed-menu.html

CSS Tabbed Menu © JavaScriptBank.comThis JavaScript code creates a tabbed JavaScript menu on the web page by using CSS. Cool and great, enjoy!

Full version: jsB@nk » CSS » Horizontal menu » CSS Tabbed Menu
URL: https://www.javascriptbank.com/css-tabbed-menu.html



CSS
<style>* {font-family : "Trebuchet MS", verdana, arial, helvetica;line-height : 17px;}html {height:100%;}body {/*background:#003300 url('img/v2_bg.jpg') repeat-x fixed center top; font-size:11px;*/letter-spacing : 1px;height:100%;margin:0;color:#666666}a:link, a:active, a:visited {text-decoration:none;color:#669966;font-weight:bold;}a:hover {color:#003300;}img {border:0px;}ul {list-style-type:circle;margin:0px 0px 0px 30px;}.active a:active {background:#ffffff;color:#336633;margin-bottom: -1px;border-bottom: 1px white solid;}.ad {margin-top:30px;text-align:center;vertical-align:middle;float:left;width:540px;}.banner {margin-bottom:-20px;height:150px;position: relative;display:table;z-index: 1;}.layout {margin: 0 auto;width:760px;height:100%;border-right: double 3px  #ccc;border-left: double  3px #ccc;background-color:#FFFFFF;}html>body .layout {height: auto;min-height: 100%;}.justify {text-align:justify;}.navigation {position: relative;width:100%;display:table;z-index: 2;letter-spacing : 0px;}.navigation ul{padding:0;margin:0;white-space: nowrap;list-style-type:none;}.navigation li {display:inline;}.navigation a:link, .navigation a:visited {font-weight:normal;float:left;padding:1px 5px 1px 5px;margin-left:5px;background:#669966;color:#ffffff;border-top: 1px solid #003300;border-right: 1px solid #003300;border-left: 1px solid #003300;border-bottom: 1px solid #003300;}.navigation a:hover {background:#ffffff;color:#336633;margin-bottom: -1px;border-bottom: 1px white solid;}.navigation a:active {background:#ffffff;color:#336633;margin-bottom: -1px;border-bottom: 1px white solid;}.partners {position: relative;z-index: 1;margin-top: -1px;border-top: 1px solid #000000;text-align:right;letter-spacing : 0px;width:760px;font-size:11px;}.partners a {font-weight:normal;}.contents {padding:10px;}big {font-size : 14px; font-weight : bold; letter-spacing : 2px;}input, select, textarea {border : 1px dotted #336633; font-size : 10px;  color : #383838; }p {padding:0px;margin:0px;}xmp {margin: 10px;padding-left:10px;font-size : 11px; color : #006600;border: 1px solid #EEEEEE;background-color:#F4F4F4;}.author {width : 75px; height : 75px; border : 1px solid #eee; }.pagename {border-left:4px solid #FF6600;font-size:15px;color:#006600;letter-spacing:2px;margin-bottom:10px;}.title  {font-weight : bold; color : #006600; font-size : 15px; }.thumb {float : left; padding-right : 3px; border : 0px none; width : 50px; height : 50px; vertical-align : middle }.float {float : left; }.who{border-bottom : 1px solid #000000; font-weight : bold; text-align : right; padding-right : 5px; }.bg1 {background-color : #ffffff; padding:5px;color : #003300; border-top: 3px double #eee;border-bottom: 3px double #eee;height : 50px; width : 98%; display : table; }.bg2 {background-color : #f4f4f4; padding:5px;color : #003300; height : 50px; width : 98%; display : table; }.footer {margin: 0 auto;text-align:center;padding: 5px;height:30px;width: 300px;background-color:#f9f9f9;border: 1px solid #eee;}</style><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<div class="navigation"><ul><li><a href="http://javascriptbank.com/" class="active">Home</a></li><li><a href="jsbank.beplaced.com/text/hometext.htm">Text</a></li><li><a href="http://javascriptbank.com/status/homestatus.htm">Status</a></li><li><a href="http://javascriptbank.com/browser/homebrowser.htm">Browser</a></li><li><a href="http://javascriptbank.com/link/homelink.htm">Link</a></li><li><a href="http://javascriptbank.com/clock/homeclock.htm">Time</a></li><li><a href="http://javascriptbank.com/utility/homeutility.htm">Utility</a></li><li><a href="http://javascriptbank.com/mouse/homemouse.htm">Mouse</a></li></ul></div><div class="partners"></div><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->