Cara membuat menu horizontal dengan mudah

Hallo gan kali saya akan berbagi tips tentang Cara membuat menu horizontal dengan mudah, Membuat menu horizontal juga bermanfaat Memudahkan Tamu di blog kalian Mencari file,Langsung aja liat.:


  1. Login ke Blogger.
  2. Klik Tata Letak.
  3. Pilih Tambah Gadged.
  4. Pilih HTML/Javascript.
  5. Copy kode di bawah ini ke Halaman HTML/Javascript.

<style media='screen' type='text/css'>
/*----- TOP -----*/
#top {background:#eee; color:#666; font-size:11px; line-height:30px; border-bottom:1px solid #ECEDE8;
opacity:.85;
filter:alpha(opacity=85);
-moz-opacity:.85;
position: fixed;
align: center;
top:0;left:0;
width:100%;
}
#top li a:hover{ background-color:#333; color:#fff; }
/*----- TOP NAV -----*/
.topnav ul li{ margin:0;}
.topnav li { float:left; width:auto; }
.topnav li a { padding:6px 11px; font-size:11px; line-height:16px; border-right:1px solid #ddd; text-decoration:none; }
/* search form */
#search { display:inline; float:right; height:14px; margin:3px 15px 0px 0px; }
#search input { float:left; background:#fff; width:160px; padding:2px 5px 3px 5px; font-family:Arial,serif; font-size:12px; font-style:italic; color:#999; line-height:12px; border:1px solid #ECEDE8; }
#search input:focus { background:#fff; border:1px solid #ddd; }
#search input.btn { background:none; border:none; margin:4px 0px 0px -23px; padding:0px; width:auto; }
</style>
<div id='top'>
<div id='search'>
<form action='/search' id='searchform' method='get'>
<input class='field' id='s' name='q' type='text' value=''/>
<input class='submit btn' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikEamxJhyphenhyphenSaJhank1ShWOs9rkwVrCLwOex5Yr-JUBVfxC0SU3O5vr_itVcPdb9QFBcJj2QnGpBt5PfvqQpZczb6B-v1twZELUXzQTk6zHT9r0Y_vSy7FTM-7PjjdOsqBH_mC2pKY2LF-s/s1600/iconsearchr.gif' type='image' value='Go'/>
</form>
</div><!--end #search -->
<div class='topnav'>  
<ul class='topnav' id='page-nav'>
<li><a href='/'>Home</a></li>
<li><a href='Link URL'>Judul</a></li>
<li><a href='Link URL'>Judul</a></li>
<li><a href='Link URL'>Judul</a></li>
<li><a href='Link URL'>Judul</a></li>
<li><a href='Link URL'>Judul</a></li>
<li><a href='Link URL'>Judul</a></li>
</ul>              
</div>
<div class='clear'/>

</div>


Keterangan :
 Link Url diganti dengan link url blog sobat yang mau dipasang
 Judul diganti dengan judul link Url yang sobat yang di pasang tadi

6. Simpan untuk melihat hasil nya di blog .
SEKIAN DARI SAYA SEMOGA BERMANFAAT
DONT COPY!!! 
 yang minat KOMEN NATI SAYA KIRIM KE EMAIL ANDA.

0 komentar:

Post a Comment