Cara Membuat List / Daftar Pada HTML

Pada kesempatan kali ini Blog Pintasku masih membahas seputar Tutorial Dasar HTML. Sebelumnya saya pernah membuat Tutorial Cara Membuat Tulisan Tebal dan Miring Di HTML, nahh sekarang saya akan memberikan Tutorial Cara Membuat Daftar (List) Di HTML.

Membuat sebuah daftar atau List itu memang sering digunakan oleh kita, terlebih jika kita suka membuat Tutorial, dimana kita menggunakan Daftar bernomor untuk mengurutkan langkah langkah dalam sebuah tutorial. Nahh sedangkan pada sebuah Dokumen HTML kita harus menggunakan beberapa Tag Khusus untuk bisa Membuat sebuah daftar atau List baik itu dengan menggunakan nomor maupun simbol. Oke kita langsung saja masuk ke Tutorialnya dibawah ini.

Cara Membuat List / Daftar Di HTML

Pada HTML sebuah daftar/list ini ada 2 jenis, yaitu :
  1. Ordered List
  2. Unordered List
  3. Defenition List (Description List)

1. Ordered List

Ordered List atau bisa diartikan secara sederhana adalah "berurutan" biasanya untuk membuat sebuah daftar yang berurutan itu menggunakan sebuah angka atau hurup. sedangkan untuk penulisannya di dalam HTML ordered list menggunakan Tag <ol> sedangkan tag untuk membuat listnya itu menggunakan tag <li>. Supaya bisa lebih gampang dimengerti silahkan perhatikan contoh kode dibawah ini.
<!DOCTYPE html>
<html>
<head>
  <title>Membuat Daftar </title>
</head>
<body>
  <h1>Daftar Murid</h1>
  <ol>
  <li>Andi</li>
    <li>Amir</li>
    <li>Budi</li>
    <li>Dono</li>
    <li>Udin</li>
  </ol>
</body>
</html>
 Hasilnya :

2. Unordered List

Unordered List adalah kebalikannya dari Ondered List yang artinya "Tidak berurutan". Unordered List biasanya menggunakan sebuah simbol baik itu bulatan maupun kotak. Untuk membuat Unordered List di HTML itu hanya perlu merubah tag <ol> menjadi <ul>.

Perhatikan contoh kode dibawah ini.
<!DOCTYPE html>
<html>
<head>
  <title>Membuat Daftar </title>
</head>
<body>
  <h1>Daftar Murid</h1>
  <ul>
  <li>Andi</li>
    <li>Amir</li>
    <li>Budi</li>
    <li>Dono</li>
    <li>Udin</li>
  </ul>
</body>
</html>
Hasilnya :

3. Defenition List

Defenition List biasanya digunakan untuk membuat sebuah daftar definisi atau daftar penjelasan. Penggunaan List ini memang sangatlah jarang, berbeda dengan jenis Ondered List dan Unordered List. Sedangkan Cara Membuat Defenition List itu menggunakan Tag <dl> sedangkan untuk judul deskripsi menggunakan tag <dt> dan untuk penjelasan atau deskripsi menggunakan tag <dd>.

Supaya bisa lebih gampang dimengerti perhatikan Contoh kode berikut ini.
<!DOCTYPE html>
<html>
<head>
<title>Membuat Daftar</title>
</head>
<body> 
<dl>
<dt>Ordered List</dt>
<dd>Digunakan untuk membuat daftar beraturan.</dd>
<dt>Unordered List</dt>
<dd>Digunakan untuk membuat daftar secara tidak beraturan.</dd>
<dt>Defenition List</dt>
<dd>Digunakan untuk menjelaskan sebuah keterangan atau deskripsi.</dd>
</dl>
</body>
</html>
Hasilnya :


Sekian Penjelasan dari saya mengenai Cara Membuat List / Daftar Pada HTML semoga tutorial ini bisa bermanfaat untuk semuanya. Mungkin artikel selanjutnya saya masih membahas tentang Tutorial Dasar HTML untuk itu tetap kunjungi Blog Pintasku

Diposkan oleh Tanggal

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)