Materi Dasar HTML #5 : Pengertian dan Cara Membuat List di dalam list (Nested List)

Setelah kita mempelajari Ordered List, Unordered List dan Description list. HTML bisa menggabungkan dari semua tag list tersebut menjadi satu (list di dalam list). 

---

Pengertian List di dalam List (Nested List)

Nested artinya bersarang, maka maksud dari Nested List artinya list di dalam list, atau list yang bersarang di dalam list. 

Nested List merupakan list yang dibuat untuk mewakili sub list dari list. Nested list bisa kita gunakan juga untuk membuat sub kategori atau label dari list, biasanya digunakan pada buku maupun ebook. 

Seperti contoh dibawah ini :

Gambar di atas merupakan tag Nested list berurutan (Ordered Nested List).

Cara Membuat Nested List (list di dalam list)

Cara penulisannya sama seperti kita membuat tag list sebelumnya yaitu description list, hanya saja pada kode html deskripsi kita ganti dengan tag list <ul> atau <ol>. 

See the Pen Ordered unordered nested list by MiftaSetiaji (@MiftaSetiaji) on CodePen.

Berikut untuk format Ordered Nested List :

<ol> 
    <li> Judul list pertama
        <ol type='A'> 
            <li> isi list pertama dari judul pertama </li> 
            <li> isi list kedua dari judul pertama </li> 
            <li> isi list ketiga dari judul pertama </li> 
        </ol>
    </li> 
</ol>

Berikut untuk format Unordered Nested List :

<ul> 
    <li> Judul list pertama
        <ul type='square'> 
            <li> isi list pertama dari judul pertama </li> 
            <li> isi list kedua dari judul pertama </li> 
            <li> isi list ketiga dari judul pertama </li> 
        </ul>
    </li> 
</ul>

---

Oke sob... sekian untuk pembahasan beberapa tag list ini dari pembahasan sebelumnya yaitu tag <ol>, <ul>, description list (<dl>,<dt>, dan <dd>), dan Nested List pada pembahasan ini.