Menu Drop Down Unik

Cara Pemasangnya apabila anda penasaran silahkan dicoba mungkin ini juga bisa dicoba Menu drop Down Blod merah.

• Login keblog anda edit template
• Cari code ]]></b:skin> copy code dibawah letakkan tepat diatasnya

nav {

height:35px;

background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0dqh1BciF7_UK-0Qk6weNpNV92lZIpMjO0tM2JHmTbGB5Lw3yMQbs-BPCesimSYbVGu4yd9ww0ek8qfgNWRDgnrzB09CEoKg3FEZhtSbB80zoHo5CLDpwWP2ETw5tpdZax1zps7AcgFX1/s1600/bg.gif) repeat-x;

position:relative;

font-family:arial, verdana, sans-serif;

font-size:11px;

width:100%;

z-index:100;

margin:0;

padding:0;

}

.nav .table {

display:table;

margin:0 auto;

}

.nav .select,

.nav .current {

margin:0;

padding:0;

list-style:none;

display:table-cell;

white-space:nowrap;

}

.nav li {

margin:0;

padding:0;

height:auto;

float:left;

}

.nav .select a {

display:block;

height:35px;

float:left;

font-weight:bold;

background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0dqh1BciF7_UK-0Qk6weNpNV92lZIpMjO0tM2JHmTbGB5Lw3yMQbs-BPCesimSYbVGu4yd9ww0ek8qfgNWRDgnrzB09CEoKg3FEZhtSbB80zoHo5CLDpwWP2ETw5tpdZax1zps7AcgFX1/s1600/bg.gif);

padding:0 30px 0 30px;

text-decoration:none;

line-height:35px;

white-space:nowrap;

color:#2b3238;

}

.nav .select a:hover,

.nav .select li:hover a {

background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg86IP8M45LEwVFTzxH89g3ZPqBEmm-kJbpj4I4t8E4ajDxd36t8d3-ONBv_Wj8yEOrnx5TWpnbu7Yfke6I8CRHp-ap65HLMzKuc69u3d9YhiGW0MZQTdgOW3-Llm6QBBpSEJ6UsKDNwqxV/s1600/hover.gif);

padding:0 0 0 15px;

cursor:pointer;

color:#2b3238;

}

.nav .select a b{

font-weight:bold;

}

.nav .select a:hover b,

.nav .select li:hover a b {

display:block;

float:left;

padding:0 30px 0 15px;

background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg86IP8M45LEwVFTzxH89g3ZPqBEmm-kJbpj4I4t8E4ajDxd36t8d3-ONBv_Wj8yEOrnx5TWpnbu7Yfke6I8CRHp-ap65HLMzKuc69u3d9YhiGW0MZQTdgOW3-Llm6QBBpSEJ6UsKDNwqxV/s1600/hover.gif) right top;

cursor:pointer;

}

.nav .select_sub {

display:none;

}

/* IE6 only */

.nav table {

border-collapse:collapse;

margin:-1px;

font-size:1em;

width:0;

height:0;

}

.nav .sub {

display:table;

margin:0 auto;

padding:0;

list-style:none;

}

.nav .sub_active .current_sub a,

.nav .sub_active a:hover {

background:transparent;

color:#2b3238;

}

.nav .select :hover .select_sub,

.nav .current .show {

display:block;

position:absolute;

width:100%;

top:35px;

background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEii0sfXhrCxWg5-fLhEEn37L58Yh-HUA0ml92s3Uj-_pdoxIAMCtjcGLCgqUpeOgoddjth5otL2cj8rNAsZ1dq0gpkDXIr8wkPrhsPYZla5ZAWGjXTBwaaGPZCcxRNLlPipSBxAMmnJCs3p/s1600/back.gif);

padding:0;

z-index:100;

left:0;

text-align:center;

}

.nav .current .show {

z-index:10;

}

.nav .select :hover .sub li a,

.nav .current .show .sub li a {

display:block;

float:left;

background:transparent;

padding:0 10px 0 10px;

margin:0;

white-space:nowrap;

border:0;

color:#2b3238;

}

.nav .current .sub li.sub_show a {

color:#2b3238;

cursor:default;

}

.nav .select .sub li a {

font-weight:normal;

}

.nav .select :hover .sub li a:hover,

.nav .current .sub li a:hover {

visibility:visible;

color:#73a0d2;

}

<!--[if IE]>

.nav ul {display:inline-block;}

.nav ul {display:inline;}

.nav ul li {float:left;}

.nav {text-align:center;}

.nav .select a:hover b,

.nav .select li:hover a b {float:none;}

<![endif]-->

• Simpan Template.
• Scrol mouse klik tata letak tambah gadget HTML/javascript copy code dibawah paste didalamnya.

<div class="nav">

<div class="table">

<ul class="select"><li><a href="#"><b>Sample</b></a></li></ul>

<ul class="select"><li><a href="#"><b>Sample Menu</b></a>

<div class="select_sub">

<ul class="sub">

<li><a href="#">Sample Menu</a></li>

<li><a href="#">Sample Menu</a></li>

<li><a href="#">Sample Menu</a></li>

<li><a href="#">Sample Menu</a></li>

<li><a href="#">Sample Menu</a></li>

</ul>

</div>

</li>

</ul>

<ul class="select"><li><a href="#"><b>Sample Menu</b></a>

<div class="select_sub">

<ul class="sub">

<li><a href="#">Sample Menu 2</a></li>

<li><a href="#">Sample Menu 2</a></li>

<li><a href="#">Sample Menu 2</a></li>

<li><a href="#">Sample Menu 2</a></li>

<li><a href="#">Sample Menu 2</a></li>

</ul>

</div>

</li>

</ul>

<ul class="select"><li><a href="#"><b>Sample Menu</b></a>

<div class="select_sub">

<ul class="sub">

<li><a href="#">Sample Menu 3</a></li>

<li><a href="#">Sample Menu 3</a></li>

<li><a href="#">Sample Menu 3</a></li>

<li><a href="#">Sample Menu 3</a></li>

<li><a href="#">Sample Menu 3</a></li>

</ul>

</div>

</li>

</ul>

<ul class="select"><li><a href="#"><b>Sample Menu</b></a>

<div class="select_sub">

<ul class="sub">

<li><a href="#">Sample Menu 4</a></li>

<li><a href="#">Sample Menu 4</a></li>

<li><a href="#">Sample Menu 4</a></li>

<li><a href="#">Sample Menu 4</a></li>

<li><a href="#">Sample Menu 4</a></li>

</ul>

</div>

</li>

</ul>

</div>

</div>

•  Ok simpan selesai semoga bermanfaat...