Cara Membuat Menu Dropdown Horizontal
Sebelum memulai, sobat bisa melihat contoh Menu di blog saya ini yang paling atas,
Selanjutnya,
Login ke Dashbord Blog sobat,
Pilih Templete untuk mengakses halaman Edit HTML,
Jangan lupa untuk Download Lengkap Template terlebih dahulu,
Jika semua sudah sekarang Cari Kode ]]></b:skin> Gunakan tombol CTRL + F dan F3 untuk mempermudah pencarian kode,
Jika kode sudah ketemu,Copy kode berikut dan letakan diatas kode ]]></b:skin> ,
Kode warna biru bisa di ganti sesuai keinginan sobat,
Langkah selanjutnya kode berikut :
Kalau sudah ketemu ,copy dan pastekan kode berikut tepat di bawah salah satu kode di atas :
Kode warna biru diata bisa di ganti sesuai kebutuhan sobat.
Kemudian Simpan Template.
Selesai dan Lihat hasilnya.
Jangan lupa baca yang lainnya Tentang Seo Analyser dan Tentang Layanan Validator W3C agar blog sobat jadi sempurna
Begitulah Cara Membuat Menu Dropdown Horizontal
Terakhir,terima kasih.
/*Menu Dropdown Horyzontal - onlinebisnis11.blogspot.com*/
#top-wrapper{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-sR-s2zlhVJRYb7sPlA9NSb0cmfGjjD_cjA0alHWFQafGHUoeNkIrDtC8fGvrtZmqPBFib_6INguBKw7JPqChW2lCPDWg9TRt6LY5orrIPf5-Fc6LPxJ0eKS_ko7wN9-nsLuuvbK7OgGp/s1600/menutop.png) repeat-x;width:100%;margin:0 auto;padding:0 auto;-moz-box-shadow:0 3px 3px 3px rgba(0,0,0,0.4);-webkit-box-shadow:0 3px 3px 3px rgba(0,0,0,0.4);border-bottom:1px solid #444;border-top:3px solid #f1c822}
#topbar{width:980px;height:40px;margin:0 auto}#top{width:100%}#top,#top ul{list-style:none;font-family:Arial, serif;margin:0;padding:0}#top a{display:block;text-decoration:none;font:normal 11px Arial;text-transform:none;color:#CECECF;border-right:1px solid #484747;border-left:1px solid #191919;padding:7px 10px 7px}#top a.arrow{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgomVeKIByNGj5k_fxdO6Aarn9Ftzc4mInsfyqtKjmxouVZYNGGSa-J8zFH820NoHXeqEqdY3yABZXG7yqXQlfmRx1X-wPCxOqu85m2xcznOfcxOo4ZruMn_AGLyPQNDN7cLtLy7c2IbRc/s1600/arrow_white.gif);background-repeat:no-repeat;background-position:right center;padding:7px 24px 7px 10px}#top li{float:left;position:static;width:auto}#top li ul,#top ul li{width:170px}#top ul li a{text-align:left;color:#fff;font-size:12px;font-weight:400;text-transform:none;font-family:Arial;border:none;padding:5px 10px}#top li ul{z-index:100;position:absolute;display:none;background:#222;padding-bottom:0px;-moz-box-shadow:0 2px 2px rgba(0,0,0,0.4);-webkit-box-shadow:0 2px 2px rgba(0,0,0,0.4)}#top li:hover a,#top a:active,#top a:focus,#top li.hvr a{background-color:#222;color:#fff}#top li:hover ul,#top li.hvr ul{display:block}#top li:hover ul a,#top li.hvr ul a{color:#edfdfd;background-color:transparent;text-decoration:none}#top li ul li.hr{border-bottom:1px solid #333;border-top:1px solid #000;display:block;font-size:1px;height:0;line-height:0;margin:0px 0}#top ul a:hover{background-color:#555!important;color:#fff!important;text-decoration:none}#top a span,#top a.arrow span{font:bold 12px Arial;color:#888;display:block;line-height:16px;text-transform:uppercase;text-shadow: 1px 2px 2px #000}#top li:hover a span,#top li:hover a.arrow span{color:#f1c822}.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden}.clearfix{display:inline-block}#inner{padding-top:40px;}#fixed {position:fixed;top:0;left:0;width:100%;height:40px;z-index:999;}#fixedinner{text-align:center;background:transparent;height:40px;position:relative;z-index:999;}* html, * html body{overflow-y:hidden;height:100%;}* html #fixedinner{margin-right:-143px;voice-family: "\"}\""; voice-family:inherit; }* html #fixedinner{margin-right:17px;}* html #fixed {position:absolute;}
<div id='header-wrapper'>
kalau tidak ketemu, bisa pakai kode ini<div class='header-outer'>
<div id='fixed'>
<div id='fixedinner'><div id='top-wrapper'><div id='topbar'><ul id='top'><li><a href='/'><span>Welcome</span>Homepage</a></li><li><a href='#'><span>Disini</span>About Us</a></li><li><a class='arrow' href='#'><span>Menu 1</span>Keterangan Disini</a><ul><li><a href='#'>Sub menu 1</a></li><li class='hr'/><li><a href='#'>Sub menu 2</a></li><li class='hr'/><li><a href='#'>Sub menu 3</a></li><li class='hr'/><li><a href='#'>Sub menu 4</a></li></ul></li><li><a class='arrow' href='#'><span>Menu 2</span>Keterangan Disini</a><ul><li><a href='#'>Sub menu 1</a></li><li class='hr'/><li><a href='#'>Sub menu 2</a></li><li class='hr'/><li><a href='#'>Sub menu 3</a></li><li class='hr'/><li><a href='#'>Sub menu 4</a></li></ul></li><li><a class='arrow' href='#'><span>Menu 3</span>Keterangan Disini</a><ul><li><a href='#'>Sub menu 1</a></li><li class='hr'/><li><a href='#'>Sub menu 2</a></li><li class='hr'/><li><a href='#'>Sub menu 3</a></li><li class='hr'/><li><a href='#'>Sub menu 4</a></li><li class='hr'/><li><a href='#'>Sub menu 5</a></li></ul></li></ul><br class='clearit'/></div><div style='clear:both;'/></div></div></div>
Ditulis Oleh : Master Online | Prediksi Online Terbaru Hongkong Singapura
Artikel Cara Membuat Menu Dropdown Horizontal ini ditulis oleh Master Online pada hari ini. Terimakasih atas kunjungan agan pada blog ini. Kritik dan saran tentang Cara Membuat Menu Dropdown Horizontal dapat agan sampaikan melalui kotak komentar dibawah ini. Bagi agan semua yang ingin mengcopy paste atau menyebar-luaskan artikel ini, tolong letakkan link dibawah ini sebagai sumbernya
0 komentar "Cara Membuat Menu Dropdown Horizontal", Baca atau Masukkan Komentar
Posting Komentar
[ Blog Ini KHUSUS 18+ Dan Mengulas Seputar Prediksi Togel Hongkong Singapura Angka Bocoran Jitu Hari Ini Senin Selasa Rabu Kamis Jumat Sabtu Minggu 2013 Rumus Ampuh Dasar Tafsir Mimpi 2D 3D 4D Data Keluaran Cerita Ngentot Seks Dewasa Video Mesum Terbaru ]
[ Segala Komentar Akan Segera Ane Publikasikan ]
xXx=>Silakan Berkomentar Gan<=xXx