Bagaimana Cara Membuat Daftar Bernomor Dalam Html

4 min read Jul 01, 2024
Bagaimana Cara Membuat Daftar Bernomor Dalam Html

Cara Membuat Daftar Bernomor dalam HTML

Daftar bernomor, atau yang biasa disebut dengan ordered list, adalah elemen penting dalam HTML untuk menampilkan informasi yang berurutan. Berikut adalah langkah-langkah untuk membuat daftar bernomor dalam HTML:

1. Gunakan Tag <ol>

Tag <ol> adalah tag pembuka untuk daftar bernomor. Setiap item dalam daftar harus ditempatkan di antara tag <ol> dan tag penutupnya, </ol>.

2. Gunakan Tag <li> untuk Setiap Item

Tag <li> digunakan untuk menandai setiap item dalam daftar. Setiap item dalam daftar akan diberi nomor secara otomatis.

Contoh Kode

Berikut adalah contoh sederhana kode HTML untuk membuat daftar bernomor:




Daftar Bernomor



Daftar Buah

  1. Apel
  2. Jeruk
  3. Mangga

Kode di atas akan menghasilkan daftar bernomor sebagai berikut:

Daftar Buah

  1. Apel
  2. Jeruk
  3. Mangga

Atribut type

Atribut type pada tag <ol> digunakan untuk menentukan jenis nomor yang akan digunakan dalam daftar. Beberapa nilai yang dapat digunakan untuk atribut type adalah:

  • 1: (Default) Nomor Arab (1, 2, 3, ...)
  • A: Huruf kapital (A, B, C, ...)
  • a: Huruf kecil (a, b, c, ...)
  • I: Angka Romawi besar (I, II, III, ...)
  • i: Angka Romawi kecil (i, ii, iii, ...)

Contoh Kode dengan Atribut type

Berikut adalah contoh kode HTML yang menggunakan atribut type untuk membuat daftar bernomor dengan tipe huruf kecil:




Daftar Bernomor



Daftar Hewan

  1. Kucing
  2. Anjing
  3. Kelinci

Kode di atas akan menghasilkan daftar bernomor sebagai berikut:

Daftar Hewan

a. Kucing b. Anjing c. Kelinci

Atribut start

Atribut start pada tag <ol> digunakan untuk menentukan nomor awal dalam daftar. Nilai default untuk atribut start adalah 1.

Contoh Kode dengan Atribut start

Berikut adalah contoh kode HTML yang menggunakan atribut start untuk membuat daftar bernomor yang dimulai dari angka 5:




Daftar Bernomor



Daftar Negara

  1. Indonesia
  2. Malaysia
  3. Singapura

Kode di atas akan menghasilkan daftar bernomor sebagai berikut:

Daftar Negara

  1. Indonesia
  2. Malaysia
  3. Singapura

Kesimpulan

Dengan menggunakan tag <ol> dan <li> dan beberapa atributnya, Anda dapat dengan mudah membuat daftar bernomor dalam HTML yang sesuai dengan kebutuhan Anda.

Latest Posts