rizkasurya11 rizkasurya11
18.04.2021
- TI
- Sekolah Menengah Pertama
terjawab
1. Jelaskan cara membuat daftar/list di html? 2. Tuliskan contoh program html untuk : judul heading
3. Tuliskan contoh program html untuk : judul di daftar/list.
2
Lihat jawaban
List atau yang biasa kita sebut dengan daftar berurutan adalah salah satu struktur html yang digunakan untuk menyajikan data secara berurutan dari atas ke bawah dalam bentuk daftar.
Sedangkan, salah satu penerapan dari list sendiri yaitu daftar isi konten.
Table Of Contents
Macam-Macam List pada HTML
Pada dasarnya ada tiga macam list pada html, yaitu:
- Ordered List adalah list yang terurut (tag
- Unordered List adalah list yang tak terurut (tag
DOCTYPE html>
<html>
<head>
<title>Membuat Ordered Listtitle>
head>
<body>
<ol>
<li>Javascriptli>
<li>PHPli>
<li>Javali>
ol>
body>
html>
0) - dan Description List adalah list yang berisi definisi. (tag
DOCTYPE html>
<html>
<head>
<title>Membuat Ordered Listtitle>
head>
<body>
<ol>
<li>Javascriptli>
<li>PHPli>
<li>Javali>
ol>
body>
html>
1)
Lalu apa perbedaanya?
Mari kita bahas lebih lanjut...
#1 Ordered List
Untuk membuat ordered list kita akan menggunakan tag
Lalu didalamnya kita membutuhkan tag
DOCTYPE html>
<html>
<head>
<title>Membuat Ordered Listtitle>
head>
<body>
<ol>
<li>Javascriptli>
<li>PHPli>
<li>Javali>
ol>
body>
html>
3 sebagai item-item yang ada didalam list tersebut.
Berikut format penulisan ordered list pada html:
<ol>
<li>Item Pertamali>
<li>Item Keduali>
<li>dan Seterusnyali>
ol>
Silahkan perhatikan contoh berikut:
DOCTYPE html>
<html>
<head>
<title>Membuat Ordered Listtitle>
head>
<body>
<ol>
<li>Javascriptli>
<li>PHPli>
<li>Javali>
ol>
body>
html>
List diatas akan diurutkan berdasarkan angka
DOCTYPE html>
<html>
<head>
<title>Membuat Ordered Listtitle>
head>
<body>
<ol>
<li>Javascriptli>
<li>PHPli>
<li>Javali>
ol>
body>
html>
4 hingga
DOCTYPE html>
<html>
<head>
<title>Membuat Ordered Listtitle>
head>
<body>
<ol>
<li>Javascriptli>
<li>PHPli>
<li>Javali>
ol>
body>
html>
5.
Namun anda bisa menambahkan atribut
DOCTYPE html>
<html>
<head>
<title>Membuat Ordered Listtitle>
head>
<body>
<ol>
<li>Javascriptli>
<li>PHPli>
<li>Javali>
ol>
body>
html>
6 pada tag
DOCTYPE html>
<html>
<head>
<title>Membuat Ordered Listtitle>
head>
<body>
<ol>
<li>Javascriptli>
<li>PHPli>
<li>Javali>
ol>
body>
html>
7 untuk mengubahnya:
DOCTYPE html>
<html>
<head>
<title>Membuat Ordered Listtitle>
head>
<body>
<ol>
<li>Javascriptli>
<li>PHPli>
<li>Javali>
ol>
body>
html>
8 untuk alfabet a, b, c, dan seterusnya;DOCTYPE html>
<html>
<head>
<title>Membuat Ordered Listtitle>
head>
<body>
<ol>
<li>Javascriptli>
<li>PHPli>
<li>Javali>
ol>
body>
html>
9 untuk alfabet A, B, C, dan seterusnya;<ol type="a">
<li>Javascriptli>
<li>Pythonli>
ol>
0 untuk angka romwari i, ii, iii, dan seterusnya;<ol type="a">
<li>Javascriptli>
<li>Pythonli>
ol>
1 untuk angka romwari I, II, III, dan seterusnya.
Contoh:
<ol type="a">
<li>Javascriptli>
<li>Pythonli>
ol>
#2 Unordered List
Unordered list adalah list yang tak terurut yang menggunakan simbol-simbol pada item-nya.
Untuk membuat Unordered list kita membutuhkan tag
DOCTYPE html>
<html>
<head>
<title>Membuat Ordered Listtitle>
head>
<body>
<ol>
<li>Javascriptli>
<li>PHPli>
<li>Javali>
ol>
body>
html>
0 dan untuk item-nya menggunakan tag
DOCTYPE html>
<html>
<head>
<title>Membuat Ordered Listtitle>
head>
<body>
<ol>
<li>Javascriptli>
<li>PHPli>
<li>Javali>
ol>
body>
html>
3.
Berikut format penulisannya:
<ul>
<li>Item Pertamali>
<li>Item Keduali>
<li>Item Selanjutnyali>
ul>
Sehingga jika kita tulis kedalam html akan seperti berikut:
DOCTYPE html>
<html>
<head>
<title>Membuat Unordered Listtitle>
head>
<body>
<ul>
<li>Javascriptli>
<li>PHPli>
<li>Javali>
<li>Pythonli>
ul>
body>
html>
Secara default simbol yang digunakan oleh unordered list adalah lingkaran kecil (disc)..
..namun kita bisa menggantinya dengan atribut
DOCTYPE html>
<html>
<head>
<title>Membuat Ordered Listtitle>
head>
<body>
<ol>
<li>Javascriptli>
<li>PHPli>
<li>Javali>
ol>
body>
html>
6.
Berikut ini nilai yang bisa diberikan untuk atribut
DOCTYPE html>
<html>
<head>
<title>Membuat Ordered Listtitle>
head>
<body>
<ol>
<li>Javascriptli>
<li>PHPli>
<li>Javali>
ol>
body>
html>
6:
<ol type="a">
<li>Javascriptli>
<li>Pythonli>
ol>
6 untuk simbol persegi;<ol type="a">
<li>Javascriptli>
<li>Pythonli>
ol>
7 (default) untuk simbol lingkaran disc;<ol type="a">
<li>Javascriptli>
<li>Pythonli>
ol>
8 tidak memakai simbol;<ol type="a">
<li>Javascriptli>
<li>Pythonli>
ol>
9 untuk simbol lingkaran;
Contoh:
<ol type="square">
<li>PHPli>
<li>Javali>
ol>
#3 Description List
Description List adalah list yang berisi deksripsi atau penjelasan dari sesuatu.
Ada tiga tag yang digunakan untuk membuat description list:
DOCTYPE html>
<html>
<head>
<title>Membuat Ordered Listtitle>
head>
<body>
<ol>
<li>Javascriptli>
<li>PHPli>
<li>Javali>
ol>
body>
html>
1 (description list) tag untuk memulai description list;<ul>
<li>Item Pertamali>
<li>Item Keduali>
<li>Item Selanjutnyali>
ul>
1 (description term) tag untuk membuat kata yang akan dideskripsikan;<ul>
<li>Item Pertamali>
<li>Item Keduali>
<li>Item Selanjutnyali>
ul>
2 (description description) tag untuk membuat penjelasan dari kata.
Format penulisannya seperti ini:
<dl>
<dt>Kata 1dt>
<dd>Deskripsi dari Kata 1dd>
<dt>Kata 2dt>
<dd>Deskripsi dari Kata 2dd>
dl>
Sehingga jika ditulis dalam html akan sepeti contoh berikut:
DOCTYPE html>
<html>
<head>
<title>Membuat Unordered Listtitle>
head>
<body>
<dl>
<dt>Javadt>
<dd>Java adalah Bahasa pemrograman turunan dari Bahasa Cdd>
<dt>Flutterdt>
<dd>Flutter adalah Bahasa pemrograman turunan dari Bahasa Dartdd>
dl>
body>
html>
Tambahan: Nested List
Sedikit tambahan, yang dimaksud dari nested list adalah:
..kita analogikan ingin membuat daftar isi dari sebuah buku.
DOCTYPE html>
<html>
<head>
<title>Membuat Unordered Listtitle>
head>
<body>
<ol>
<li>Bahasa C
<ul>
<li>Bahasa C++li>
<li>Bahasa C#li>
<li>Bahasa Javali>
ul>
li>
<li>Dart
<ul>
<li>Flutterli>
ul>
li>
<ol>
body>
html>
Penutup
Dalam praktiknya, penggunaan tag list di dalam html sendiri tidak hanya digunakan untuk membuat daftar saja..
Bagaimana cara membuat daftar terurut daftar dengan item angka dalam HTML?
Di HTML, elemen untuk membuat daftar terurut dan tidak terurut adalah ol, ul dan li. Untuk membuat daftar terurut, Anda menggunakan elemen ol. Di dalam elemen ol ini, Anda dapat menuliskan tiap-tiap itemnya menggunakan elemen li. Secara standar, daftar terurut akan ditampilkan dengan menggunakan angka.
Apa saja tag tag untuk membuat daftar list angka di HTML?
Cara membuat ordered list HTML. Ordered list atau list angka/nomor dibuat dengan menggunakan tag
. Penulisan item-item list tersebut menggunakan tag
yang ditelakkan diantara tag pembuka dan tag penutup
.Tag apa yang digunakan untuk membuat list Ordered?
Ordered List digunakan untuk membuat daftar yang memiliki urutan. Contohnya yaitu: langkah-langkah, daftar isi, daftar siswa, susunan acara, dll.
Tag yang
digunakan untuk membuat ordered list yaitu
-
, dan untuk
membuat isi dari
list menggunakan elemen
- .
List HTML apa saja?
Ada tiga macam jenis list yang bisa dibuat di HTML:.
Ordered List adalah list yang terurut;.
Unordered List adalah list yang tak terurut;.
dan Descriptiona List adalah list yang berisi definisi..
