Menu Horizontal CSS Warna Orange

Untuk membuat menu Dropdown silahkan ikuti langkah-langkah berikut:

Paste di atas kode ]]></b:skin>

/* Menu Horisontal

---------------------------------------------*/

#menuhorisontalpic{
width:100%;margin:0 auto;
padding:0 auto;
color:#fff;
}

.menuhorisontal{
width:950px;
height:30px;margin:0 auto;
padding:0 auto;
color:#fff;
}

.menuhorisontal ul{
margin: 0;
padding-left: 0px;
color:#fff;
font:1.0em Arial,Helvetica,sans-serif;
font-weight:bold;
font-size:12px
}

.menuhorisontal li{
display: inline;
margin: 0;
color:#fff;
}

.menuhorisontal li a, .horisontal li a:visited{
margin:0 auto;
float:left;
padding:8.5px 15px 8.5px 15px;
text-transform:uppercase;
color:#fff;
font-weight:bold;
font-size:11px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGM913USW14xg8dW7tiyp7ix8o2KQGbhD98L9yBNDVoDj5RvoPL8m6hicCNtZ4HADmfLav7UykLgtzBSombw7acm-qxS4r1AK5Je8lCbd646OZYzherbJ7_w2d5mKYzw10xIOq0_CbfSM/s1600/navblack0B0C0B.png) top left repeat-x;
-moz-border-radius:4px 4px 0 0;
-khtml-border-radius:4px 4px 0 0;
-webkit-border-radius:4px 4px 0 0;
border-radius:4px 4px 0 0;
color:fff;
margin-right:2px;
}

.menuhorisontal li a:hover {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbErCXlI-IF1tSdKPZXKqROTpujDVD9kFATrYghstvPnBIMsx0HLGS_HwxpWLNbeAyKE5imwMYcUV1Lfwn86V-ytXK5rRWptuel1kAQgqbZHeHusRR7Z5Th2sdsIBYM9hwSP5SPDdPy5M/s1600/nav_orangeD28708.png) top left repeat-x;
text-decoration:none;
color:#333;
}

.menuhorisontal li.home a{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbErCXlI-IF1tSdKPZXKqROTpujDVD9kFATrYghstvPnBIMsx0HLGS_HwxpWLNbeAyKE5imwMYcUV1Lfwn86V-ytXK5rRWptuel1kAQgqbZHeHusRR7Z5Th2sdsIBYM9hwSP5SPDdPy5M/s1600/nav_orangeD28708.png) top left repeat-x;
color:#333;
padding:8.5px 12px;
}

.menuhorisontal li.selected a {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbErCXlI-IF1tSdKPZXKqROTpujDVD9kFATrYghstvPnBIMsx0HLGS_HwxpWLNbeAyKE5imwMYcUV1Lfwn86V-ytXK5rRWptuel1kAQgqbZHeHusRR7Z5Th2sdsIBYM9hwSP5SPDdPy5M/s1600/nav_orangeD28708.png) top left repeat-x;
text-decoration:none;
color:#333;
}

lanjut

• cari kode <div id='wrapper'> atau <div id='content'> copas kode dibawa ini tepat dibawa kode tersebut!

• boleh juga cari kode </header> kemudian copas kode dibawah ini diatas kode </header>

<div id='menuhorisontalpic'>

<div class='menuhorisontal'>

<ul>

<li class='home'><a href='/'><img alt='home' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_Rcni7dsQy80iZ94ZoFYhypyUmSiP2e8AXMUQ1bxvCZE4OU9sRXdU2a9TUYTD7Ld0tBi_H86HcY7r59a-Vgvo0NMhuSvfgyRCERs0ye0jdijTtCaokcLiR8Of7cW3_UP73-Li24pkkr8/s1600/bg_home.gif' style='padding:0 0;'/></a></li>

<li><a href='#your-link' target='_blank'>About Us</a></li>

<li><a href='#your-link' target='_blank'>Pasang Iklan Gratis</a></li>

<li><a href='#your-link' target='_blank'>My Blog</a></li>

<li><a href='#your-link' target='_blank'>Free Software</a></li>

<li><a href='#your-link' target='_blank'>Free Ebook</a></li>

<li><a href='#your-link' target='_blank'>Seo</a></li>

<li><a href='#your-link' target='_blank'>Download</a></li>

<li><a href='#your-link' target='_blank'>Sexy Chinese</a></li>

</ul>

</div>

</div>

ini gambar menunya bro..!