Membuat Daftar Tersarang Nested List Di HTML

WhatsApp: 081389716731
Email: bendolkentus@gmail.com

ARTIKEL POPULER

Details: Category: HTML; Hits: 12475

Membuat daftar tersarang nested list elemen HTML ul ol li — Membuat Daftar Tersarang (Nested List) Di HTML

Di artikel Membuat Daftar Terurut Dan Tidak Terurut Di HTML, Anda dapat mempelajari bagaimana membuat daftar terurut (ordered list) dan tidak terurut (unordered list). Sebuah daftar terurut atau tidak terurut juga dapat terletak di daftar terurut atau tidak terurut yang lain. Sebuah daftar (list) yang berada di daftar (list) yang lain disebut dengan daftar tersarang (nested list).

Dalam pembuatannya, Anda tinggal mengulangi langkah pembuatan daftar terurut atau daftar tidak terurut untuk diletakkan di daftar terurut atau daftar tidak terurut yang lain. Untuk membuat daftar tersarang, elemen HTML yang digunakan tetap sama yaitu ul, ol dan li.

1. Daftar tersarang tidak terurut (unordered nested list).

<!DOCTYPE html>
<html>
<head>
<title>Membuat Daftar Tersarang (Nested List) Di HTML</title>
</head>
<body>
<p>Daftar minuman kesukaanku:</p>
<ul>
   <li>Kopi (coffee).</li>
   <ul>
      <li>Kopi putih (white coffee).</li>
      <li>Kopi hitam (black coffee).</li>
   </ul>
   <li>Teh (tea).</li>
   <ul>
      <li>Teh hijau (green tea).</li>
      <li>Teh hitam (black tea).</li>
   </ul>
   <li>Susu (milk).</li>
</ul>
</body>
</html>

Membuat daftar terurut ordered tidak terurut unordered tersarang nested list di HTML

2. Daftar tersarang terurut (ordered nested list).

<!DOCTYPE html>
<html>
<head>
<title>Membuat Daftar Tersarang (Nested List) Di HTML</title>
</head>
<body>
<p>Daftar minuman kesukaanku:</p>
<ul>
   <li>Kopi (coffee).</li>
   <ol>
      <li>Kopi putih (white coffee).</li>
      <li>Kopi hitam (black coffee).</li>
   </ol>
   <li>Teh (tea).</li>
   <ol>
      <li>Teh hijau (green tea).</li>
      <li>Teh hitam (black tea).</li>
   </ol>
   <li>Susu (milk).</li>
</ul>
</body>
</html>