Laporan Praktikum Desain Web Praktik: Nama: Noor Kamila Aprilia Nim: 5200311122
Laporan Praktikum Desain Web Praktik: Nama: Noor Kamila Aprilia Nim: 5200311122
1. Sourcecode
- HTML
- CSS
2. Penjelasan Sourcecode
- Sourcecode HTML
Membuat doctype html dengan judul Tampilan Menu.Lalu beri link untuk
menghubungkan dengan file css.Css diberi nama Tampilan.css
Buat kelas dengan nama kelas nav.Di dalam nav masukkan tag ul . Di dalam
tag ul terdapat a href agar menu menu tsb bisa diklik . Buat 4 menu (
Menu,atas 1,atas 2,atas 3).
Di dalam menu diberi submenu. Beri tag ul dan a href lagi lalu beri nama pada
a href tsb (Samping 1, Samping 2, Samping 3,Samping 4)
- Sourcecode CSS
Atur margin,padding dan font textnya
Pada kelas nav atur lebar,border,tinggi dan beri atribut line height untuk
mengatur jarak submenu
Atur nav ul li. Setiap menunya beri lebar 20%,tingginya 45px. Beri atribut
float:left agar tampilan menunya bisa kesamping . Agar titik di menu bisa hilang
beri atribut list-style: none , atur nama agar bisa ketengah menggunakan atribut
text-align: center . Gunakan atribut border-radius agar ujung kotak menu bisa
melengkung seperti gambar contoh . Atur warna background dengan atribut
background dan atur warna teks denga atribut color
Atur peletakan sub menu dengan lebar: 100px,tinggi: 60px dan gunakan border
radius agar setiap pojok kanan atas dan kiri bawah bisa melengkung
Agar tampilan submenu bisa diklik muncul buat kelas lagi yaitu .nav ul li ul dan
.nav ul li:hover ul
Di kelas .nav ul li ul li beri atribut display: none agar hilang submenu nya dan
saat disentuh tidak muncul
Di kelas .nav ul li:hover ul beri atribut display: block agar saat diklik
submenunya bisa ditampilkan
Beri warna pada teks
3. Hasil