Tag: menu

  • [:en]Membuat Responsive Menu Dengan CSS – Part 3[:]

    [:en]Membuat Responsive Menu Dengan CSS – Part 3[:]

    [:en]Lanjutan bagian terakhir membuat menu responsif menggunakan css. Buat file mobile.css lalu masukkan script dibawah ini pada baris 1 /*Responsive Styles*/ @media screen and (max-width : 1100px){ nav{ font-size: 1em; } li{ width: 11%; min-width: 100px; } li a{ height: 120px; } } Pada script di atas adalah penambahan responsive style dengan ukuran max 1100px…

  • [:en]Membuat Responsive Menu Dengan CSS – Part 2[:]

    [:en]Membuat Responsive Menu Dengan CSS – Part 2[:]

    [:en] Jika meneruskan tutorial pada artikel sebelumnya maka ada beberapa modifikasi script pada file index.html dan style.css yang lama dan menambahkan file css baru yaitu mobile.css Modifikasi index.html Kemudian buat file css baru mobile.css dan buat link di index.html <html> <head> <title>Menu Responsive Obi.ninja</title> <link rel=”stylesheet” type=”text/css” href=”css/style.css”> <link rel=”stylesheet” type=”text/css” href=”css/mobile.css”> </head> Lakukan modifikasi pada…

  • [:en]Membuat Responsive Menu Dengan CSS – Part 1[:]

    [:en]Membuat Responsive Menu Dengan CSS – Part 1[:]

    [:en]Kali ini saya akan berbagi tutorial sederhana untuk membuat Dropdown Menu menggunakan HTML dan CSS saja plus responsive. Responsive desain pada pembuatan template website adalah penyesuaian tampilan / template dengan ukuran browser, penyesuaian yang dimaksud adalah penyesuaian “style” melalui CSS yang disesuaikan dengan ukuran sehingga navigasi dan pemetaan kontennya pun akan mengikuti. Saat ini memang semua…

  • [:en]Membuat Dropdown Menu Dengan CSS – part 2[:]

    [:en]Membuat Dropdown Menu Dengan CSS – part 2[:]

    [:en]Melanjutkan tutorial sederhana untuk membuat Dropdown Menu menggunakan HTML dan CSS saja bagian 2. Kita lanjutkan langkah-langkahnya sebagai berikut : 7. Pada setiap list <li> ditambahkan link <a> dan nama menunyayang berfungsi untuk link URL di setiap menu 8. Jika sudah buat file CSS dengan nama (style.css) kemudian ketikkan script nav{ -webkit-font-smoothing:antialiased; margin :0; padding :…

  • [:en]Membuat Dropdown Menu Dengan CSS – part 1[:]

    [:en]Membuat Dropdown Menu Dengan CSS – part 1[:]

    [:en]Kali ini saya akan berbagi tutorial sederhana untuk membuat Dropdown Menu menggunakan HTML dan CSS saja. Saya mencoba membuat sebuah menu horizontal untuk obi.ninja. Di ke tujuh menu saya hanya membuat 2 buah dropdown saja, selebihnya silakan mencoba memodifikasi sendiri. Langkah-langkah untuk membuat dropdown menu adalah sebagai berikut : 1. Siapkan dulu cemilan dan minuman…