Oke langsung saja kita pada pembahasan.
- Pertama Silahkan login pada akun blog sobat
- Selanjutnya Masuk ke Dasbor
- Pilih Tata Letak
- Lalu Klik Tambah Gadget *Biasanya dipasang dibawah header
- Pilih HTML/Javascript
- Selanjutnya Copy kode CSS dibawah ini dan pastekan pada HTML/Javascript
- Berikut kode CSS-nya
<style type="text/css">
.solidblockmenu{
margin: 0;
padding: 0;
float: left;
font: bold 13px Arial;
width: 100%;
overflow: hidden;
margin-bottom: 1em;
border: 1px solid #625e00;
border-width: 1px 0;
background: url(https://lh6.googleusercontent.com/-PcV4VpR8vVs/UMtMGi8I0II/AAAAAAAAAfA/1yw3SNrhT1M/w248-h248/navbangdadan.gif) center center repeat-x;
}
.solidblockmenu li{
display: inline;
}
.solidblockmenu li a{
float: left;
color: white;
padding: 9px 11px;
text-decoration: none;
border-right: 1px solid white;
}
.solidblockmenu li a:visited{
color: white;
}
.solidblockmenu li a:hover, .solidblockmenu li .current{
color: white;
background: url(https://lh6.googleusercontent.com/-fKZAiQvUg8E/UMtMGrxQwrI/AAAAAAAAAfE/1IihW4JVYEQ/w248-h248/navaktifbangdadan.gif) center center repeat-x;
}
</style>
<br />
<ul class="solidblockmenu">
<li><a class="current" href="http://bangdadan.blogspot.com/">Home</a></li>
<li><a href="http://bangdadan.blogspot.com/2012/12/about-coretan-bang-dadan.html">About</a></li>
<li><a href="http://www.emailmeform.com/builder/form/58bZ51u00rcDY7vL8RS3p9V">Contact</a></li>
<li><a href="http://bangdadan.blogspot.com/search/label/blogger%20tutorial">Tutorial Blog</a></li>
<li><a
Nah selesai deh, sekarang sobat sudah punya menu horizontal seperti pada demo diatas.
Mungkin sampai disini dulu pembahasan kita kali ini tentang Cara Membuat Menu Horizontal CSS Block Keren Tanpa Edit HTML. Semoga artikel ini bermanfaat bagi sobat yang membutuhkan. Terimkasih......
0 komentar:
Posting Komentar