list Bersarang
Termasuk bagian Dasar-Dasar dalam perjalanan HTML di Coddy. Pelajaran 14 dari 60.
Kamu bisa menempatkan satu list di dalam list lain. Ini disebut nested list. Ini berguna untuk membuat struktur hierarkis, seperti kerangka atau menu bertingkat.
Untuk membuat list bersarang, kamu cukup menempatkan elemen <ul> atau <ol> di dalam elemen <li> dari list lain.
Berikut contoh list tanpa urutan yang bertingkat:
<ul>
<li>Item 1</li>
<li>Item 2
<ul>
<li>Subitem 2.1</li>
<li>Subitem 2.2</li>
</ul>
</li>
<li>Item 3</li>
</ul>Butir kedua berisi daftar bertingkat dengan dua subbutir. Di browser, tampilannya akan seperti ini:
- Butir 1
- Butir 2
- Subbutir 2.1
- Subbutir 2.2
- Butir 3
Kamu juga bisa membuat daftar berurutan bersarang atau mencampur keduanya.
Tantangan
MudahBuat dokumen HTML dengan daftar bertingkat. Daftar tersebut harus terlihat seperti ini:
- Fruits
- Apple
- Banana
- Orange
- Vegetables
- Carrot
- Broccoli
- Spinach
- Grains
Coba sendiri
<!DOCTYPE html>
<html>
<body>
<!-- Tulis kodemu di sini -->
</body>
</html>
Uji dirimuPelajaran ini berisi kuis singkat. Mulai pelajarannya untuk menjawab kuis dan melacak progresmu.
Semua pelajaran di Dasar-Dasar
1Dasar-Dasar HTML
Apa itu HTML?Struktur Dasar HTMLTag dan ElemenTag Bersarang dan Tag PenutupKomentar dalam HTML7Halaman Profil Pribadi
Gambaran Umum ProyekBagian Header
Foto ProfilBagian Tentang SayaTautan Media Sosial2Teks dan Pemformatan
JudulParagrafPindah BarisTeks Tebal dan MiringTeks Tebal dan Miring LagiRangkuman: Pemformatan8Formulir dan Input Bagian 1
Dasar FormulirInput TeksAtribut InputKolom Kata SandiLabel untuk InputUlasan, Formulir Dasar11Halaman Pendaftaran Acara
Gambaran Umum ProyekBagian HeaderBagian Detail AcaraFormulir PendaftaranBagian Footer9Formulir dan Input Bagian 2
Tombol RadioKotak CentangMenu DropdownTombolTombol dalam FormulirRangkuman, Formulir #1Rangkuman, Formulir #2Latihan sendiri: Playground Web