BROWSE
Dalam Artikel sebelumnya saya telah mejelaskan tentang pembuatan menu vertikal, dan pada kesempatan kali ini saya juga akan menjelaskan tentang pembuatan menu vertikal tapi untuk kali ini tampilannya saya buat semenarik mungkin,,
Setelah melihat contoh di atas apakah anda tertarik untuk membuat nya,
Oke!! Langsung saja ikuti langkah-langkah dibawah ini :
Klik Elemen Halaman - Pilih Tambah Gadget - Klik HTML/Javascript - Copy paste kode Dibawah ini,, Setelah itu paste kan di halaman HTML/Javascript :
Ctt : Jika Anda Ingin Tidak Ada Judul di halaman HTML/javascript, isikan saja pada judul nya dengan kode
<style type="text/css">
/* Widget By Wwww.kikiyo.co.cc */
#ddblueblockmenu{
border: 0px solid #000000; /*Main Border Color */
border-bottom-width: 0;
width: 100%;
}
#ddblueblockmenu ul{
margin: 0;
padding: 0;
list-style-type: none;
font: normal 90% 'Trebuchet MS', 'Lucida Grande', Arial, sans-serif;
}
#ddblueblockmenu a{
display: block;
padding: 3px 0;
padding-left: 9px;
width: 94%; /*Widget By Wwww.kikiyo.co.cc*/
text-decoration: none;
color: #ffffff;
background-color: #9966CC;
border-bottom: 3px solid #CCFFFF;
border-left: 10px solid #1958b7;
list-style-type:none;
}
* html #ddblueblockmenu a{
width: 94%;
width: 94%; /*Widget By Wwww.kikiyo.co.cc*/
}
#ddblueblockmenu a:hover {
background-color: #FF0000; /*Widget By Wwww.kikiyo.co.cc*/
border-left-color: #33FFCC; /*Widget By Wwww.kikiyo.co.cc*/
}
#ddblueblockmenu div.menutitle{
color: #ffffff; /* Title Font Color */
border-bottom: 0px solid black;
padding: 1px 0;
padding-left: 5px;
background-color: #00CCCC; /*Widget By Wwww.kikiyo.co.cc*/
font: bold 90% 'Trebuchet MS', 'Lucida Grande', Arial, sans-serif;
}
/* Widget By Wwww.kikiyo.co.cc */
.style1 {color: #00FF00}
.style2 {color: #FFFF00}
.style3 {
color: #0066FF;
font-weight: bold;
font-size: 18px;
}
</style>
<div id="ddblueblockmenu">
<div class="style3">BROWSE</div>
<ul>
<a href="http://www.Alamat-blog.Blogspot.com" target="_blank">Home</a>
<a href="http://www.Alamat-blog.Blogspot.com" target="_blank">Edit</a>
<a href="http://www.Alamat-blog.Blogspot.com" target="_blank">Edit</a>
<a href="http://www.Alamat-blog.Blogspot.com" target="_blank">Edit</a>
<a href="http://www.Alamat-blog.Blogspot.com" target="_blank">Edit</a>
<a href="http://www.Alamat-blog.Blogspot.com" target="_blank">Edit</a>
</ul>
</div>
Ket :
1.Tulisan yang berwarna biru Ganti dengan nama Blog anda atau Alamat Url Tujuannya..
2.Tulisan yang berwarna kuning Ganti dengan Nama Link tujuan atau nama judul
3.Tulisan Edit dapat anda ganti dengan Nama atau judul link tujuan anda
sumber: kikiyo.co.cc
Tidak ada komentar:
Posting Komentar