#35 Membuat daftar bersarang ( nested list ) pada HTML

sebelumnya kita telah belajar tentang daftar berurutan dan daftar tidak berurutan, pada tutorial ini kita akan mempelajari tentang nested list atau list di dalam list.

Deskripsi

Nested list adalah daftar yang dibuat untuk mewakili sub-item atau sub daftar dari daftar item.

nested list bisa digunakan untuk membuat subkategori atau tabel konten untuk buku dan ebook.

cara penulisan sintaksnya di dalam elemen <li> yang ingin dibuat sub daftarnya

Contoh daftar bersarang dengan tag ol

     <ul>
        <li> Membuat Teh manis
            <ol>
                <li> Masukan air panas </li>
                <li> Masukan teh celup </li>
                <li> Tambahkan gula secukupnya </li>
                <li> aduk hingga gula menjadi larut </li>
                <li> Teh siap disajikan </li>
            </ol>
        </li>
        <li> Menghidupkan komputer
            <ol>
                <li> Pastikan perangkat komputer sudah terhubung ke listrik </li>
                <li> Tekan tombol switch power hingga lampu indikator menyala </li>
                <li> Tekan tombol power pada komputer </li>
                <li> Komputer siap digunakan </li>
            </ol>
        </li>
    </ul>Code language: HTML, XML (xml)

Hasilya

Contoh daftar bersarang dengan tag ul

     <ul>
        <li>Minuman
            <ul>
                <li>Es Teh</li>
                <li>Teh hangat</li>
                <li>Es Jeruk Manis</li>
                <li>Es Jeruk Nipis</li>
            </ul>
        </li>
        <li>Jus
            <ul>
                <li>Jus Jambu</li>
                <li>Jus Alpukat</li>
                <li>Jus Jeruk</li>
                <li>Jus Mangga</li>
            </ul>
        </li>
    </ul>Code language: HTML, XML (xml)