Saturday , December 5 2020
Home » HTML 5 » Membuat List di HTML

Membuat List di HTML

Membuat List di HTML

Lebakcyber.net – Membuat List di HTML. Oke pada tutorial kali ini kita akan belajar membuat sebuah list pada halaman HTML. List atau yang biasa dikenal juga dengan daftar berurutan adalah salah satu fungsi yang ada di HTML yang dapat digunakan untuk menampilkan data secara berurutan ke bawah.

Didalam HTML, penulisan list dilakukan dengan menggunakan tag <li>, dalam membuat list pada HTML ada dua buah pilihan tampilan yang dapat digunakan, yaitu ordered list dan juga unordered list.

  • Ordered List adalah sebuah list yang berfungsi untuk menampilkan sebuah daftar list dalam bentuk angka atau huruf, dan tag yang digunakan dalam membuat ordered list tersebut menggunakan tag <ol>
  • Unordered List adalah sebuah lisft yang berfungsi untuk menampilkan sebuah daftar list kedalam bentuk bulatan ataupun kotak di depannya. Dan tag yang digunakan untuk membuat unordered list ini adalah <ul>

Berikut ini adalah contoha bagaimana cara membuat sebuah list biasa pada halaman HTML

Advertisements
<!DOCTYPE html>
<html>
<head>
<title>belajar List di HTML - Lebak Cyber</title>
</head>
<body>

    <li>Ini adalah daftar list pertama</li>
    <li>Ini adalah daftar list kedua</li>
    <li>Ini adalah daftar list ketiga</li>
    <li>Ini adalah daftar list keempat</li>
    
</body>
</html>

Bisa dilihat pada perintah HTML diatas kita menggunakan tag <li> untuk membuat ordered list pada HTML dan hasilnya tampilan standar list di HTML diawali dengan tanda titik di depannya.

Ordered List di HTML

Sekarang kita akan membuat sebuah ordered list pada halaman HTML, untuk membuat ordered list di HTML kita menggunakan tag <ol> dan nanti hasil listnya akan diawali dengan angka atau huruf, contohnya seperti dibawah ini :

Advertisements
<!DOCTYPE html>
<html>
<head>
<title>Belajar Ordered List di HTML</title>
</head>
<body>

<ol>
  <li>Contoh Ordered List Pertama</li>
  <li>Contoh Ordered List Kedua</li>
  <li>Contoh Ordered List Ketiga</li>
  <li>Contoh Ordered List Keempat</li>
</ol>

</body>
</html>

Unordered List di HTML

Sekarang kita akan membuat sebuah unordered list pada halaman HTML, untu membuat sebuah unordered list pada halaman HTML kita harus menggunakan tag <ul>, contohnya seperti dibawah ini :

<!DOCTYPE html>
<html>
<head>
<title>Belajar Unordered list di HTML</title>
</head>
<body>

<p>Ini adalah contoh unordered list - Lebakcyber.net</p>
<ul>
    <li>Contoh unordered list 1</li>
    <li>Contoh unordered list 2</li>
    <li>Contoh unordered list 3</li>
    <li>Contoh unordered list 4</li>
</ul>

</body>
</html>

Penggunaan list pada halaman HTML bukan hanya dapat kita gunakan untuk membuat sebuah daftar pada halaman HTML saja. Kita juga bisa menggabungkan JavaScript, CSS yang nantinya dapat digunakan untuk membuat sebuah menu navigasi pada halaman web yang sedang dibuat.

Oke jadi sampai disini dulu pembahasan kita mengenai bagiamana cara membuat list pada HTML. Semoga tutorial sederhana ini dapat bermanfaat dan sampai bertemu lagi pada tutorial belajar HTML selanjutnya ya.

About Firdan Ardiansyah

Admin di lebakcyber.net Untuk berhubungan dengan saya, silahkan kirim email ke : firdan@lebakcyber.net

Check Also

Menampilkan Gambar di HTML

Menampilkan Gambar di HTML

Menampilkan Gambar di HTML Lebakcyber.net – Menampilkan gambar di HTML. Pada kesempatan belajar HTML kali …

Leave a Reply

Your email address will not be published. Required fields are marked *