1. Login ke Blogger.
2. Masuk ke Design => Page Elements => Add a Gadget => HTML/JavaScript.
3. Masukkan kode dibawah ini:
<style type="text/css">4. Save dan Lihat hasilnya.
/* vertikal vertikal merah di mulai
---------------------------------------- */
/*Credits: CSS Library */
/*URL: http://css-lybrary.blogspot.com */
#vertikal-merah{
border-bottom-width: 0;
}
#vertikal-merah ul{
margin: 0px;
padding:0px;
font: normal 100% 'georgia; /*pemilihan bentuk huruf */
}
#vertikal-merah a{
display: block;
padding: 4px;
padding-left: 10px;
border:1px solid #ccc;
-moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; -moz-border-radius-bottomleft: 10px; -moz-border-radius-bottomright: 10px;
text-decoration: none; /*agar link tidak bergaris bawah */
color: black;
border-top:1px solid #f3f3f3;
border-bottom:1px solid #f3f3f3;
border-right:1px solid #f3f3f3;
background-color: #fff;
border-left: 10px solid #ccc;
}
#vertikal-merah a:hover {
background-color: #f2f2f2;
border-top:1px solid #ccc;
border-bottom:1px solid #ccc;
border-left:1px solid #ccc;
border-right:10px solid #ccc;
color: #cc0000;
}
</style>
<div id="vertikal-merah">
<ul>
<a href="http://blogcopypaste.blogspot.com/">Home Page</a>
<a href="http://blogcopypaste.blogspot.com/">Tutorial</a>
<a href="http://blogcopypaste.blogspot.com/">Tips</a>
<a href="http://masphecorel.blogspot.com/">Belajar CorelDRAW</a>
<a href="http://blogcopypaste.blogspot.com/">About</a>
<!-- untuk menambah link baru -->
</ul></div><p></p>
Reff: Modifikasi vertical menu
No comments:
Post a Comment