Cara Membuat Daftar/List Dengan HTML



Jangan Pernah bosan yaa untuk terus mengikuti artikel lain nya dari LazyCodding. yang berisi dasar-dasar untuk belajar html


Kali ini kita akan mempelajari “Cara Membuat daftar/List Dengan HTML”.kode HTML yang akan admin bagikan kali ini adalah hasil dari kreasi admin sendiri. Silahkan untuk mempelajari nya dengan serius :D.
Dan silahkan juga bagi pembaca yang ingin mengembangkan kode di bawah ini dengan kreasi anda masing-masing agar kelihatan lebih keren lagi.

Oke kita masuk pada Pembagian dari Tag List.
Tag list terbagi 2 yaitu Order List (Berurutan) dan Unorder List(Tidak berurutan).Sedikit  Penjelasan tentang kedua tag tersebut.

1. Order List (Berurutan)
Yang di maksud dengan Berurutan yaitu tag yang di tampilkan biasa nya berupa angka atau huruf dan di Order List (Berurutan) Biasa nya juga menggunakan Tag "ol"

2. Unorder List (Tidak Berurutan)
Yang di maksud dengan Tidak berurutan yaitu tag yang di tamplikan berupa bulatan atau berbentuk kotak. Di Unorder List (Tidak berurutan) biasa nya menggunakan tag "ul"



Cara Membuat Daftar/List Menggunakan HTML


nah itulah sedikit penjelasan tentang Order List dan Unorder List.Baiklah sekarang kita Masuk ke contoh Pembuatan nya. Dan berikut adalah contoh kode HTML dengan menggunakan tag "ol"



Silahkan copy kode diatas kedalam notepad++ lalu save dengan nama Order List.html.
Maka akan Terlihat hasil seperti di bawah ini :




Hasil Setelah Di save

Daftar Barang

  1. Tas
  2. Koper
  3. Helm
  4. Topi
  5. Sandal


Nah untuk yang Unorder List ( Tidak berurutan) tinggal kita ganti saja tag yang di atas menjadi tag "ul"
silahkan lihat seperti yang di bawah ini:




Silahkan copy kode diatas dan save dengan nama Unorder List.html.
Maka akan  kelihatan hasilnya seperti yang di bawah ini:


Hasil Setelah Di save

Daftar Barang

  • Tas
  • Koper
  • Helm
  • Topi
  • Sandal

Bagaimana ???
mudah bukan dalam pembuatan nya....jadi tidak perlu pusing dengan bahasa Pemrograman HTML.itulah sedikit dasar dalam belajar HTML.
jika anda masih kurang mengerti dari penjelasan di atas silahkan hubungi admin LazyCodding atau bisa langsung berkomentar di kolom komentar yang sudah ada di bawah ini.

Post a Comment

0Comments
Post a Comment (0)