Membuat Menu Bar Simple Responsive

Kalau dilihat-lihat blog saya memang jarang update ya. Maklum sobat, saya masih sibuk. Ini saja membuat posting agar sekiranya tidak terlalu kosong. Jadi saya buatkan saja menu bar simple.
Menu bar ini saya buat hanya 5 menit. Jadi jika masih banyak kekurangan bisa sobat komplain di komentar saja :D.

Penampakan :

Demo : Coming Soon

CSS :

#tempeoreg {

}
#tempeoreg a {
text-decoration:none;
color:#eee;
}
#tempeoreg a:visited {
text-decoration:none;
color:#eee;
}
#tempeoreg a:hover {
color:#fff;
}
#tempeoreg ul {
width:100%;
background:#31ace8;
}
#tempeoreg li {
display:inline-block;
background:#31ace8;
padding:20px;
cursor:pointer;
margin:0;transition:all .5s ease;
margin-left:-5px;
font-size:80%;
}
#tempeoreg li:hover {
background:#21eee8;
transition:all .5s ease;
}
.dropdown ul {
display:none;
}
#tempeoreg:hover
}
.active {
background:#21eee8;
border-bottom:#888;
}

Kode HTML :

<div id='tempeoreg'>
   <ul>
      <li style='color:white;background:#21eee8;border-bottom:#888'><a href=''>Home</a></li>
      <li><a href=''>Profil</a></li>
      <li><a href=''>About</a></li>
      <li><a href=''>Exchange</a></li>
      <li><a href=''>Policy</a></li>
   </ul>
</div>

Kode diatas bisa diterapkan dimana saja. Mulai dari blogger, wordpress, template html, php dll.
Budayakan memberi sumber saat copy paste.