Membuat Menu Dropdown Sederhana Dengan CSS

Membuat menu dropdown berfungsi saat kita membutuhkan sebuah sub menu untuk menu utama. Pada trik ini , saya akan mencoba untuk membuat sebuah menu dorpdown sederhana dengan menggunakan CSS. Tahap pertama yang perlu kita lakukan yaitu membuat sebuah file css baru dan beri nama style.css lalau ketikkanlah kode berikut pada file style.css (diusahakan ketik yach. jangan copas) hehehe

ul {
margin : 0;
padding :0;
list-style:none;
}
ul li{
position:relative;
float:left;
width:100%;
}
li ul{
position: absolute;
top:30px;
display:none;
}
ul li a{
display:block;
text-decoration:none;
line-height:20px;
color:#000;
padding:5px;
bacground:#CC0;
margin: 0 2px;
}
ul li a:hover{background:#66F}
li:hover ul, li over ul{display:block;}

Dapat sobat lihat kode diatas, terdapat beberapa format css yang mengatur tampilan dari tang

dan , dimana tag-tag tersebut berfungsi untuk mengatur tampilan list menu. Setelah itu buat sebuah file html baru untuk menampilka style menu pada file css yang baru saja sobat buat. 

 



Menu Dropdown css

Jika sudah selesai.. silahkan di cek melalui browser sobat..