<ol> yang merupakan abreviasi dari ordered list, <ul> yang merupkan abreviasi dari unordered list dan <dl> yang merupkan abreviasi dari definition list. Untuk klarifikasi dan penulisan tag tersebut silahkan baca article ini hingga final :-).Ordered List
Ordered list atau biasa disebut dengan daftar berurutan sanggup dibentuk dengan memakai tag<ol>. Untuk menciptakan item, sahabat sanggup memakai tag <li> yang merupakan abreviasi dari list item atau daftar item.Berikut ini adlah referensi penggunaan tag
<ol> di HTML :<!DOCTYPE html> <html> <head> <title>Belajar Membuat Daftar di HTML</title> </head> <body> <h2>Langkah-langkah menyalakan televisi :</h2> <ol> <li>Colokan kable televisi ke stopkontak</li> <li>Arahkan remote ke televisi</li> <li>Lalu tekan tombol power yang ada di remote</li> </ol> </body> </html>Jika sahabat buka di broser, maka tampilannya akan menyerupai gambar di bawah ini :
Penomoran daftar dilsayakan setips otomatis saat sahabat menambahkan item. Gunakanlah tag
<ol> saat menciptakan sebuah daftar yang memerlukan urutan yang benar, menyerupai "Langkah-langkah menyalakan televisi" dan sebagainya.Unordered List
Berbeda dengan ordered list yang menandai setiap item dengan memakai angka setips otomatis dan berurut, jikalau unorderd list menandai setiap item dengan simbol. Baik berupa bulat maupun persegi, sahabat juga sanggup mengganti simbol sesuai impian sahabat dengan memakai CSS. Untuk menciptakan unordered list sahabat akan memakai tag<ul>, kemudian untk item sahabat akan memakai tag <li>.Berikut ini adlah referensi penggunaan tag
<ul> di HTML :<!DOCTYPE html> <html> <head> <title>Belajar Membuat Daftar di HTML</title> </head> <body> <h2>Jenis-jenis kendaraan transportasi :</h2> <ul> <li>Angkot</li> <li>Kapal laut</li> <li>Pesawat</li> </ul> </body> </html>Jika sahabat jalankan di broser, maka tampilannya akan menyerupai gambar di bawah ini :
Jika sahabat ingin menciptakan daftar yang tidak terlalu mementingkan urutan pada setiap item, maka sahabat sanggup memakai ordered list contohnya "Jenis-jenis kendaraan transportasi" dan sebagainya.
Definition List
Jika sahabat membutuhkan sebuah daftar yang berisi klarifikasi atau deskripsi mengenai item tersebut, maka sahabat sanggup memakai definition list.Untuk menciptakan definition list sahabat akan memakai tag
<dl>, untk menciptakan item sahabat akan memakai tag <dt> yang merupakan abreviasi dari data term dan untk menciptakan deskripsi dari item tersebut sahabat akan memakai tag <dd> yang merupakan abreviasi dari data description.Berikut ini adlah referensi penggunaan tag
<dl> di HTML :<!DOCTYPE html> <html> <head> <title>Belajar Membuat Daftar di HTML</title> </head> <body> <dl> <dt>IPA</dt> <dd>IPA adlah abreviasi dari Ilmu Pengetahuan Alam</dd> <dt>IPS</dt> <dd>IPS adlah abreviasi dari Ilmu Pengetahuan Sosial</dd> <dt>MTK</dt> <dd>MTK adlah abreviasi dari Matematika</dd> </dl> </body> </html>Jika sahabat jalankan di broser, maka tampilannya akan menyerupai gambar di bawah ini :
Terlihat dari gambar di atas deskripsi item yang terdapat di tag
<dd> akan sedikit menjauh dari item yang di deskripsikan.Nested List
Nested list atau item bersarang adlah sebuah daftar yang mempunyai daftar lagi di dalam item tersebut.Berikut ini adlah referensi penggunaan nested list di HTML :
<!DOCTYPE html> <html> <head> <title>Belajar Membuat Daftar di HTML</title> </head> <body> <h2>Apa yang harus Saya lsayakan hari ini :</h2> <ol> <li>Pergi ke pasar : <ul> <li>Beli cabe</li> <li>Beli bawang</li> <li>Beli tomat</li> </ul> </li> <li>Belajar : <dl> <dt>IPA</dt> <dd>IPA adlah abreviasi dari Ilmu Pengetahuan Alam</dd> <dt>IPS</dt> <dd>IPS adlah abreviasi dari Ilmu Pengetahuan Sosial</dd> <dt>MTK</dt> <dd>MTK adlah abreviasi dari Matematika</dd> </dl> </li> </ol> </body> </html>Jika sahabat jalankan di broser, maka tampilannya akan menyerupai gambar di bawah ini :
Biasanya daftar menyerupai ini biasa di gunakan untk menciptakan sajian WEB atau untk keperluan lainnya menyerupai pada referensi di atas adalah "Apa yang harus Saya lsayakan hari ini" dan sebagainya.
Pada article selanjutnya sahabat akan mempelajari Trik Membuat Link di HTML. Sumber https://mas-abdi.blogspot.com/
No comments:
Post a Comment