Membuat Dropdown Menu Dengan CSS

Posted by Yogo Prestiyanto on Friday, November 23, 2012

Pada artikel kali ini saya ingin mencontohkan membuat dropdown menu dengan css.
Fungsi dari dropdown menu sendiri adalah untuk menghemat ruang pada web kita karena terlalu banyaknya link atau teks yang ditampilkan di halaman web.
Langsung saja saya suka memberi contoh daripada bertele-tele dengan tulisan.
Lihat contoh dibawah ini kalau perlu praktekkan sendiri :

Persiapan, saya akan membuat 2 file yaitu terdiri dari file index.html. Untuk file css nya akan terpisah dengan nama file style.css.

Untuk file index.html berikut scriptnya :



Untuk file style.css berikut scriptnya :



Untuk hasil, simpan kedua file tersebut kedalam satu folder. Jalankan index.html pada browser kesayangan anda. Tampilannya seperti berikut ini :
Membuat Dropdown Menu Dengan CSS

















File style.css hanya memberikan efek warna supaya tampilan dari dropdown menu agar lebih menarik.
Jika anda mungkin malas mencoba file diatas berikut saya akan berikan file index.html dan style.css secara gratis.







   

1 comment: