CSS YATAY HAZIR MENÜLER TASARIM ÜSTTÜ VEYA İSTEDİĞİNİZ YERE KOYUN
MENÜ 1 <style type="text/css"> /*Credits: Dynamic Drive CSS Library */ /*URL: http://www.dynamicdrive.com/style/ */ .mattblacktabs{ width: 100%; overflow: hidden; border-bottom: 1px solid black; /*bottom horizontal line that runs beneath tabs*/ } .mattblacktabs ul{ margin: 0; padding: 0; padding-left: 10px; /*offset of tabs relative to browser left edge*/ font: bold 12px Verdana; list-style-type: none; } .mattblacktabs li{ display: inline; margin: 0; } .mattblacktabs li a{ float: left; display: block; text-decoration: none; margin: 0; padding: 7px 8px; /*padding inside each tab*/ border-right: 1px solid white; /*right divider between tabs*/ color: white; background: #414141; /*background of tabs (default state)*/ } .mattblacktabs li a:visited{ color: white; } .mattblacktabs li a:hover, .mattblacktabs li.selected a{ background: black; /*background of tabs for hover state, plus tab with "selected" class assigned to its LI */ } </style> <div class="mattblacktabs"> <ul> <li><a href="http://www.dynamicdrive.com">Home</a></li> <li><a href="http://www.dynamicdrive.com/new.htm">DHTML</a></li> <li><a href="http://www.dynamicdrive.com/style/">CSS</a></li> <li><a href="http://www.dynamicdrive.com/forums/">Forums</a></li> <li><a href="http://tools.dynamicdrive.com/imageoptimizer/">Gif Optimizer</a></li> </ul> </div>
MENÜ 2
<style type="text/css"> /*Credits: Dynamic Drive CSS Library */ /*URL: http://www.dynamicdrive.com/style/ */ .indentmenu{ font: bold 13px Arial; width: 100%; /*leave this value as is in most cases*/ overflow: hidden; } .indentmenu ul{ margin: 0; padding: 0; float: left; width: 80%; /*width of menu*/ border: 1px solid #ccccff; /*dark purple border*/ border-width: 1px 0; background: black url(media/indentbg.gif) center center repeat-x; } .indentmenu ul li{ display: inline; } .indentmenu ul li a{ float: left; color: #00ccff; /*text color*/ padding: 5px 11px; text-decoration: none; border-right: 1px solid #ccccff; /*dark purple divider between menu items*/ } .indentmenu ul li a:visited{ color: #00ccff; } .indentmenu ul li a:hover, .indentmenu ul li .current{ color: #00ccff !important; /*text color of selected and active item*/ padding-top: 6px; /*shift text down 1px for selected and active item*/ padding-bottom: 4px; /*shift text down 1px for selected and active item*/ background: black url(media/indentbg2.gif) center center repeat-x; } </style> <div class="indentmenu"> <ul> <li><a href="http://www.dynamicdrive.com/">Home</a></li> <li><a href="http://www.dynamicdrive.com/style/" class="current">CSS</a></li> <li><a href="http://www.dynamicdrive.com/forums/">Forums</a></li> <li><a href="http://tools.dynamicdrive.com">Webmaster Tools</a></li> <li><a href="http://www.javascriptkit.com/">JavaScript</a></li> <li><a href="http://www.cssdrive.com">Gallery</a></li> </ul> </div>
Ana Sayfa
3 MENÜ <!--- KAYNAK: http://www.gezginler.net ---> <!--- KAYNAK: http://www.gezginler.net ---> <STYLE type=text/css>A { COLOR: #ffcc00; FONT-SIZE: 10pt; TEXT-DECORATION: none } A:hover { COLOR: black; TEXT-DECORATION: none } A.plain:hover { COLOR: #ffcc00; FONT-SIZE: 10pt; TEXT-DECORATION: underline } #box { POSITION: absolute; VISIBILITY: hidden; layer-background-color: #004080 } #limebox { BACKGROUND-COLOR: #99cc66 } #bluebox { BACKGROUND-COLOR: #99cc66 } #mnubar { FONT: bold 10pt arial } </STYLE> <SCRIPT language=JavaScript> ns=window.navigator.appName == "Netscape" ie=window.navigator.appName == "Microsoft Internet Explorer" function openIt(x) { if(ns) { showbox= document.layers[x+1] showbox.visibility = "show"; showbox.top=44; var items = 5 ; for (i=1; i<=items; i++) { elopen=document.layers[i] if (i != (x + 1)) { elopen.visibility = "hide" } } } if(ie) { curEl = event.toElement curEl.style.background = "black" showBox = document.all.box[x]; showBox.style.visibility = "visible"; showBox.style.top = 46; var items = 5 for (i=0; i<items; i++) { elOpen=document.all.box[i] barEl=document.all.mnubar[i] if (i != x){ elOpen.style.visibility = "hidden" barEl.style.background = "black" } } } } function closeIt() { var items = 5 for (i=0; i<items; i++) { if(ie){ document.all.box[i].style.visibility = "hidden" barEl=document.all.mnubar[i] barEl.style.background = "black" } if(ns){ document.layers[i+1].visibility = "hide"} } } </SCRIPT> <STYLE fprolloverstyle>A:hover { COLOR: #f0ffcc; FONT-WEIGHT: bold } </STYLE> <TABLE bgColor=#004080 border=0 cellPadding=0 height=18 id=mainmenu width=800> <TBODY> <TR> <TD align=middle bgColor=#000000 colSpan=7 noWrap vAlign=center> <P align=left><B><FONT color=#ffcc00 face=Arial size=4> <DIV align=center>GEZGİNLER.NET --=Java Scriptler=-- GEZGİNLER.NET</DIV></FONT></B> <P></P></TD></TR> <TR> <TD align=middle bgColor=#000000> <P align=center><FONT color=#ffcc00><B> </B></FONT><A class=plain href="http://www.gezginler.net/" onmouseover=closeIt()><FONT color=#ffcc00><B>Ana Sayfa</B></FONT></A><FONT color=#ffcc00><B> </B></FONT><br><br></TD><br> <TD align=middle bgColor=#000000 noWrap><A href="http://www.gezginler.net" id=mnubar onmouseover=openIt(0)><FONT color=#ffcc00>İlk ana menu </FONT></A> <br><BR></TD> <TD align=middle bgColor=#000000 noWrap><A href="http://www.gezginler.net" id=mnubar onmouseover=openIt(1)><FONT color=#ffcc00>İkinci ana menu </FONT></A> <br> <BR></TD> <TD align=middle bgColor=#000000 noWrap><A href="http://www.gezginler.net" id=mnubar onmouseover=openIt(2)><FONT color=#ffcc00>Üçüncü ana menu</FONT></A> <br> <BR></TD> <TD align=middle bgColor=#000000 noWrap><FONT color=#ffcc00><A href="http://www.gezginler.net" id=mnubar onmouseover=openIt(3)><FONT color=#ffcc00>Dördüncü ana menu</FONT></A> <br><BR></FONT></TD> <TD align=middle bgColor=#000000 noWrap><A href="http://www.gezginler.net" id=mnubar onmouseover=openIt(4)><FONT color=#ffcc00>Beşinci ana menu</FONT></A> <br> <BR></TD> <TD align=middle bgColor=#000000 noWrap vAlign=top width=30> </TD></TR></TBODY></TABLE><BR><BR><br> <DIV onmouseover=closeIt()><LAYER onmouseover=closeIt()> <P> </P></LAYER></DIV><!-- Menu 1 --> <DIV id=box style="LEFT: 120px"> <TABLE border=1 id=bluebox> <TBODY> <TR> <TD><A href="http://www.gezginler.net/">İlk alt menu</A></TD> <TD><A href="http://www.gezginler.net/">İkinci alt menu</A></TD></TR></TBODY></TABLE></DIV><!-- Menu 2 --> <DIV id=box style="LEFT: 200px"> <TABLE border=1 id=limebox> <TBODY> <TR> <TD><A href="http://www.gezginler.net/">İlk alt menu</A></TD> <TD><A href="http://www.gezginler.net/">İkinci alt menu</A></TD> <TD><A href="http://www.gezginler.net/">Üçüncü alt menu</A></TD></TR></TBODY></TABLE></DIV><!-- Menu 3 --> <DIV id=box style="LEFT: 240px"> <TABLE border=1 id=bluebox> <TBODY> <TR> <TD><A href="http://www.gezginler.net/">İlk alt menu</A></TD> <TD><A href="http://www.gezginler.net/">İkinci alt menu</A></TD> <TD><A href="http://www.gezginler.net/">Üçüncü alt menu</A></TD> <TD><A href="http://www.gezginler.net/">Dördüncü alt menu</A></TD> <TD><A href="http://www.gezginler.net/">Beşinci alt menu</A></TD></TR></TBODY></TABLE></DIV><!-- Menu 4 --> <DIV id=box style="LEFT: 400px"> <TABLE border=1 id=limebox> <TBODY> <TR> <TD><A href="http://www.gezginler.net/">İlk alt menu</A></TD> <TD><A href="http://www.gezginler.net/">İkinci alt menu</A></TD> <TD><A href="http://www.gezginler.net/">Üçüncü alt menu</A></TD> <TD><A href="http://www.gezginler.net/">Dördüncü alt menu</A></TD></TR></TBODY></TABLE></DIV><!-- Menu 5 --> <DIV id=box style="LEFT: 520px"> <TABLE border=1 id=bluebox> <TBODY> <TR> <TD><A href="http://www.gezginler.net/">İlk alt menu</A></TD> <TD><A href="http://www.gezginler.net/">İkinci alt menu</A></TD> <TD><A href="http://www.gezginler.net/">Üçüncü alt menu</A></TD></TR></TBODY></TABLE></DIV> <!--- KAYNAK: http://www.gezginler.net ---> <!--- KAYNAK: http://www.gezginler.net --->
MENÜ 4 <!--- KAYNAK: http://www.gezginler.net ---> <script language="JavaScript1.2"> //Hover-up Menu Bar: By Dynamicdrive.com var cssdefinition='<style>n.menuitems{nborder:2.5px solid #0099cc;n}nn.menuitems a{ntext-decoration:none;ncolor:black;n}n</style>' //No need to edit beyond here if (document.all||document.getElementById) document.write(cssdefinition) function over_effect(e,state, bgcolor){ if (document.all) source4=event.srcElement else if (document.getElementById) source4=e.target if (source4.className=="menuitems"){ source4.style.borderStyle=state source4.style.backgroundColor=bgcolor } else{ while(source4.tagName!="DIV"){ source4=document.getElementById? source4.parentNode : source4.parentElement if (source4.className=="menuitems"){ source4.style.borderStyle=state source4.style.backgroundColor=bgcolor } } } } </script> </head> <body> <div style="background-color:#0099cc;width:60%;height:25px;padding-top:5px" onMouseover="over_effect(event,'outset','#0066cc')" onMouseout="over_effect(event,'solid','#0099cc')" onMousedown="over_effect(event,'inset')" onMouseup="over_effect(event,'outset')"> <font face="Arial" size="2"> <strong> <span><b><a href="mailto:webmaster@gezginler.net"><font color="#000080"> BİZE ULAŞIN</font></a> </b></span> <span class="menuitems"><a href="http://www.gezginler.net"><font color="#00FF00"> MENÜ 1 </font></a></span> <span class="menuitems"><a href="http://www.gezginler.net"> <font color="#00FF00">MENÜ 2 </font></a></span> <span class="menuitems"><a href="http://www.gezginler.net"> <font color="#00FF00">MENÜ 3 </font></a></span> <span class="menuitems"><a href="http://www.gezginler.net"><font color="#00FF00"> MENÜ 4 </font></a></span> <span class="menuitems"><a href="http://www.gezginler.net"><font color="#00FF00"> MENÜ 5</font> </a></span></strong> </font> </div> <!--- KAYNAK: http://www.gezginler.net --->
SİTE ADI | SİTE ADI | SİTE ADI | SİTE ADI | SİTE ADI | SİTE ADI