Vízszintes menü 07.
Demo látható a lap tetején!
Csak másold ki a kódot és illeszd be oldalad jobb vagy bal oldali egyszerű moduljába forráskód nézetbe :) Írd át a menücímeket és linkeld is át őket. És kész is vagy
HTML kód
<ul id="menu">
<li class="first" id="home">
<a href="//aranymeli.gportal.hu/"><b>Home</b></a></li>
<li id="single">
<a href="//aranymeli.gportal.hu/gindex.php?pg=24588232"><b>Site</b></a></li>
<li id="single">
<a href="//aranymeli.gportal.hu/gindex.php?pg=19322271"><b>Graphics</b></a></li>
<li id="single">
<a href="//aranymeli.gportal.hu/gindex.php?pg=20199690"><b>GP- leírások</b></a></li>
<li id="single">
<a href="//aranymeli.gportal.hu/gindex.php?pg=18012139"><b>Scripts</b></a></li>
<li id="dropdown">
<a href="//aranymeli.gportal.hu/gindex.php?pg=12162135"><b>Regisztráció</b></a></li>
<li id="dropline">
<a href="http://www.facebook.com/pages/lindadesign/236608076356358" target="_blank"><b>Facebook</b></a></li>
<li id="flyout">
<a href="//aranymeli.gportal.hu/gindex.php?pg=12241863"><b>Itt hirdess</b></a></li>
<li id="support">
<a href="http://users2.smartgb.com/g/g.php?a=s&i=g24-02933-45" target="_blank"><b>Vendégkönyv</b></a></li>
<li class="last" id="contact">
<a href="//gportal.hu/" target="_blank"><b>G-Portál</b></a></li>
</ul>
CSS kód
<style type="text/css">
#menu {padding:0; margin:0; list-style:none; width:1012px; height:50px; position:absolute; top:0px; left:0px;}
#menu li {position:relative; float:left;}
#menu li a {display:block; height:50px; padding:0; width:100px; float:left; color:#444; text-decoration:none; font-family:"trebuchet MS", sans-serif; font-size:14px; text-align:center; cursor:pointer; background: url(//aranymeli.gportal.hu/portal/aranymeli/image/gallery/1330447477_70.gif); line-height:50px;}
#menu li a b {position:relative;}
#menu li a:hover,
#menu li a:active,
#menu li a:focus,
.home #menu li#home a,
.single #menu li#single a,
.dropdown #menu li#dropdown a,
.dropline #menu li#dropline a,
.flyout #menu li#flyout a,
.support #menu li#support a,
.contact #menu li#contact a
{background: url(//aranymeli.gportal.hu/portal/aranymeli/image/gallery/1330447487_54.png) no-repeat right top; cursor:pointer; color:#c60;}
* html #menu li a:hover,
* html #menu li a:active,
* html #menu li a:focus,
* html .home #menu li#home a,
* html .single #menu li#single a,
* html .dropdown #menu li#dropdown a,
* html .dropline #menu li#dropline a,
* html .flyout #menu li#flyout a,
* html .support #menu li#support a,
* html .contact #menu li#contact a
{background:none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='//aranymeli.gportal.hu/portal/aranymeli/image/gallery/1330447487_54.png', sizingMethod='scale');}
#menu li a:hover b,
#menu li a:active b,
#menu li a:focus b,
.home #menu li#home a b,
.single #menu li#single a b,
.dropdown #menu li#dropdown a b,
.dropline #menu li#dropline a b,
.flyout #menu li#flyout a b,
.support #menu li#support a b,
.contact #menu li#contact a b
{cursor:pointer;}
--> </style>
|