search

Cara menggunakan fungsi

1 years ago
Komentar: 0
Dibaca: 131

Cara menggunakan fungsi

Show
Home/HTML/ Perintah Dasar dl Element yang Umum Digunakan di HTML

HTML Perintah Dasar dl Element yang Umum Digunakan di HTML

labkom997 Januari 2020

0 27 2 menit dibaca

Cara menggunakan fungsi

Labkom99.com – Kali ini Belajar tentang perintah dasar element dl Pada HTML Yang Sering Digunakan. Element < dl > pada HTML digunakan untuk menjelaskan definisi suatu kata benda. Kata benda biasanya berada pada tingkat pertama atau sebagai Judul.  Sedangkan pada tingkat kedua adalah ditafsirkan sebagai definisi.

Daftar definisi juga disebut daftar kamus karena memiliki format yang sama dengan kamus. Dalam daftar definisi, setiap item memiliki bidang definisi indentasi, seperti kamus yang menerjemahkan teks. Tag HTML yang digunakan adalah  

, , dan
.

Contoh Elemen Perintah Dasar dl

Tag dl digunakan untuk menampilkan item daftar dengan judul dan item konten. Tag dl menyematkan tag dt dan dd, tag dt mewakili judul, dan tag dd mewakili konten. Perintah Elemen Kebijakan dl, dt, dan dd digunakan bersama, bukan secara terpisah

Tag dl, dt, dan dd memiliki efek rendering indentasinya sendiri, tetapi biasanya digunakan untuk mendefinisikan ulang gaya baru dengan CSS untuk memenuhi kebutuhan estetika halaman web secara keseluruhan.

<DL>
<dt> ????? </dt>
    <dd> ????? </dd>
    <dd> … </dd>
<dt> ????? </dt>
    <dd> · ·· </dd>
    <dd> ··· </dd>
</dl>

Perintah Dasar Element Tag

digunakan untuk membuat daftar definisi, dan tag
digunakan untuk membuat item tingkat atas dalam daftar. Tag ini hanya dapat digunakan dalam tag
.Ketika ditampilkan,
> Konten dari definisi tag akan dibiarkan rata. 

Tag

digunakan untuk membuat item level kedua dalam daftar. Tag ini hanya dapat digunakan dalam tag
. Saat ditampilkan, konten yang ditentukan oleh tag
akan relatif terhadap Konten yang ditentukan oleh tag diindentasi rata kanan.

Artikel terkait

  • Cara menggunakan fungsi

    Pelajari HTML Lengkap Untuk Pemula Dengan Contoh Untuk Pelatihan

    29 Juni 2022

  • Cara menggunakan fungsi

    Keterampilan HTML5 yang Harus Dikuasai Pengembang Web

    8 Mei 2021

Baca Juga. Membuat Paragraf Dengan HTML

<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>Membuat Daftar Element</title>
</head>
<body>
<p><strong> Informasi rekrutmen perusahaan:：</strong>
  <dl>
  <dt>Persyaratan：</dt>
<dd>Wanita, 158 CM , Berpenampilan menarik.</dd>
<dd>Memiliki pengalaman kerja stu tahun. </dd>
<dd>Bekelakuan baik.</dd>
<dt>Bonafit：</dt>
<dd>gaji pokok + komisi + bonus + tunjangan </dd>
<dd>asuransi kesehatan </dd>
<dd>sistem promosi yang adil </dd>
<dd>rumah dinas </dd>
</dl><br />
<br />
</body>
</html>
_

Perintah Dasar Elemen Dt dan dd pertama ditempatkan pada tag dl, dan tag dt dan dd berada pada level yang sama di bawah dl. Ini juga berarti bahwa dt tidak dapat ditempatkan di dd, dan dd tidak dapat ditempatkan di dt. Di bawah dl, dt dan dd ada di label yang sama. Label DD atau berapa banyak. Pada saat yang sama harus menambahkan dl untuk menggunakan tag dt atau tag dd saja

Kesimpulan

Kami sebenarnya menggunakan Perintah Dasar Elemen dl dt dd paling banyak di HTML. Biasanya ada judul pertanyaan, dan nomor daftar di bawah judul sederhana (judul kolom + daftar pertanyaan yang sesuai) dan pertanyaannya sesuai dengan pola di atas. Di lingkungan di mana kita dapat menyederhanakan kode HTML dari waktu ke waktu, belajar menggunakan dl dt dd secara fleksibel, memahami dan mengontrol sintaks struktur tag

HTML sudah menyediakan elemen untuk membuat daftar. Ada tiga jenis daftar yang dapat dibuat dalam HTML

  1. Daftar Berurutan adalah daftar berurut;
  2. Daftar Unordered adalah daftar unordered;
  3. dan Keterangan Daftar adalah daftar yang berisi definisi

Mari kita bahas satu per satu…

1. Daftar Terurut dalam HTML

Daftar pesanan dibuat dengan tag <ol>. Kemudian diisi dengan item yang akan dimasukkan dalam daftar. Item dibuat dengan tag <li> (daftar item)

Cara menggunakan fungsi

Contoh

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>

Hasil

Cara menggunakan fungsi

Daftar di atas diurutkan berdasarkan angka dari 

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
0, 
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
1, 
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
2, hingga 
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
3

Lalu bagaimana jika kita ingin menggunakan huruf seperti 

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
_4, 
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
5, 
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
6 atau angka romawi seperti 
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
7, 
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
8, 
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
9?

Mudah

Untuk membuat sesuatu seperti itu, kita dapat menggunakan atribut 

<!DOCTYPE html>
<html>

<head>
    <title>Ordered List dengan Atribut Type</title>
</head>

<body>
    <h3>List dengan type alfabet</h3>
    <ol type='a'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type alfabet kapital (huruf besar)</h3>
    <ol type='A'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi</h3>
    <ol type='i'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi kapital</h3>
    <ol type='I'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
</body>

</html>
0 pada tag 
<!DOCTYPE html>
<html>

<head>
    <title>Ordered List dengan Atribut Type</title>
</head>

<body>
    <h3>List dengan type alfabet</h3>
    <ol type='a'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type alfabet kapital (huruf besar)</h3>
    <ol type='A'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi</h3>
    <ol type='i'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi kapital</h3>
    <ol type='I'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
</body>

</html>
1 dan nilai-nilai berikut dapat diberikan

  • <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
    4 untuk alfabet 
    <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
    4, 
    <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
    5, 
    <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
    6, dan seterusnya;
  • <!DOCTYPE html>
<html>

<head>
    <title>Ordered List dengan Atribut Type</title>
</head>

<body>
    <h3>List dengan type alfabet</h3>
    <ol type='a'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type alfabet kapital (huruf besar)</h3>
    <ol type='A'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi</h3>
    <ol type='i'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi kapital</h3>
    <ol type='I'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
</body>

</html>
    6 untuk alfabet 
    <!DOCTYPE html>
<html>

<head>
    <title>Ordered List dengan Atribut Type</title>
</head>

<body>
    <h3>List dengan type alfabet</h3>
    <ol type='a'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type alfabet kapital (huruf besar)</h3>
    <ol type='A'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi</h3>
    <ol type='i'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi kapital</h3>
    <ol type='I'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
</body>

</html>
    6, 
    <!DOCTYPE html>
<html>

<head>
    <title>Ordered List dengan Atribut Type</title>
</head>

<body>
    <h3>List dengan type alfabet</h3>
    <ol type='a'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type alfabet kapital (huruf besar)</h3>
    <ol type='A'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi</h3>
    <ol type='i'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi kapital</h3>
    <ol type='I'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
</body>

</html>
    8, 
    <!DOCTYPE html>
<html>

<head>
    <title>Ordered List dengan Atribut Type</title>
</head>

<body>
    <h3>List dengan type alfabet</h3>
    <ol type='a'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type alfabet kapital (huruf besar)</h3>
    <ol type='A'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi</h3>
    <ol type='i'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi kapital</h3>
    <ol type='I'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
</body>

</html>
    9, dan seterusnya;
  • <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Unordered List</title>
</head>

<body>
    <h1>Bahasa Pemrograman untuk dipelajari:</h1>
    <ul>
        <li>Javascript</li>
        <li>PHP</li>
        <li>Java</li>
        <li>Python</li>
        <li>Kotlin</li>
    </ul>
</body>
</html>
    0 untuk angka Romawi 
    <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Unordered List</title>
</head>

<body>
    <h1>Bahasa Pemrograman untuk dipelajari:</h1>
    <ul>
        <li>Javascript</li>
        <li>PHP</li>
        <li>Java</li>
        <li>Python</li>
        <li>Kotlin</li>
    </ul>
</body>
</html>
    0, 
    <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Unordered List</title>
</head>

<body>
    <h1>Bahasa Pemrograman untuk dipelajari:</h1>
    <ul>
        <li>Javascript</li>
        <li>PHP</li>
        <li>Java</li>
        <li>Python</li>
        <li>Kotlin</li>
    </ul>
</body>
</html>
    2, 
    <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Unordered List</title>
</head>

<body>
    <h1>Bahasa Pemrograman untuk dipelajari:</h1>
    <ul>
        <li>Javascript</li>
        <li>PHP</li>
        <li>Java</li>
        <li>Python</li>
        <li>Kotlin</li>
    </ul>
</body>
</html>
    3, dan seterusnya;
  • <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
    7 untuk angka romawi 
    <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
    7, 
    <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
    8, 
    <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Ordered List</title>
</head>

<body>
    <h1>Buah Favoritku:</h1>
    <ol>
        <li>Jeruk</li>
        <li>Durian</li>
        <li>Pisang</li>
        <li>Pepaya</li>
        <li>Mangga</li>
    </ol>
</body>
</html>
    9, dan seterusnya

Contoh

<!DOCTYPE html>
<html>

<head>
    <title>Ordered List dengan Atribut Type</title>
</head>

<body>
    <h3>List dengan type alfabet</h3>
    <ol type='a'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type alfabet kapital (huruf besar)</h3>
    <ol type='A'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi</h3>
    <ol type='i'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi kapital</h3>
    <ol type='I'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
</body>

</html>

Hasil

Cara menggunakan fungsi

2. Daftar Unordered dalam HTML

Unordered list adalah unordered list yang menggunakan simbol pada itemnya. Unordered list dibuat dengan tag 

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Unordered List</title>
</head>

<body>
    <h1>Bahasa Pemrograman untuk dipelajari:</h1>
    <ul>
        <li>Javascript</li>
        <li>PHP</li>
        <li>Java</li>
        <li>Python</li>
        <li>Kotlin</li>
    </ul>
</body>
</html>
8 dan untuk item juga dibuat dengan tag <li>

Cara menggunakan fungsi

Contoh

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Unordered List</title>
</head>

<body>
    <h1>Bahasa Pemrograman untuk dipelajari:</h1>
    <ul>
        <li>Javascript</li>
        <li>PHP</li>
        <li>Java</li>
        <li>Python</li>
        <li>Kotlin</li>
    </ul>
</body>
</html>

Hasil

Cara menggunakan fungsi

Secara default simbol yang digunakan oleh unordered list adalah lingkaran kecil (disc). Kita juga bisa menggantinya dengan atribut 

<!DOCTYPE html>
<html>

<head>
    <title>Ordered List dengan Atribut Type</title>
</head>

<body>
    <h3>List dengan type alfabet</h3>
    <ol type='a'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type alfabet kapital (huruf besar)</h3>
    <ol type='A'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi</h3>
    <ol type='i'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi kapital</h3>
    <ol type='I'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
</body>

</html>
0

Berikut adalah nilai yang dapat diberikan untuk atribut 

<!DOCTYPE html>
<html>

<head>
    <title>Ordered List dengan Atribut Type</title>
</head>

<body>
    <h3>List dengan type alfabet</h3>
    <ol type='a'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type alfabet kapital (huruf besar)</h3>
    <ol type='A'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi</h3>
    <ol type='i'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
    <h3>List dengan type romawi kapital</h3>
    <ol type='I'>
        <li>Tutorial List di HTML</li>
        <li>Tutorial Link di HTML</li>
        <li>Tutorial Tabel di HTML</li>
    </ol>
</body>

</html>
0

  • <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Unordered List</title>
</head>

<body>
    <h1>Bahasa Pemrograman untuk dipelajari:</h1>
    <ul type="square">
        <li>Javascript</li>
        <li>PHP</li>
        <li>Java</li>
        <li>Python</li>
        <li>Kotlin</li>
    </ul>
    <h1>Framework untuk dipelajari:</h1>
    <ul type="circle">
        <li>Vuejs</li>
        <li>Svelte</li>
        <li>Reactjs</li>
    </ul>
    <h1>Tools untuk dipelajari:</h1>
    <ul type="none">
        <li>Gulp</li>
        <li>NPM</li>
        <li>Js Lint</li>
    </ul>
    <h1>Pelajari juga:</h1>
    <ul type="disc">
        <li>JSON</li>
        <li>XML</li>
        <li>Markdown</li>
    </ul>
</body>
</html>
    2 untuk simbol persegi;
  • <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Unordered List</title>
</head>

<body>
    <h1>Bahasa Pemrograman untuk dipelajari:</h1>
    <ul type="square">
        <li>Javascript</li>
        <li>PHP</li>
        <li>Java</li>
        <li>Python</li>
        <li>Kotlin</li>
    </ul>
    <h1>Framework untuk dipelajari:</h1>
    <ul type="circle">
        <li>Vuejs</li>
        <li>Svelte</li>
        <li>Reactjs</li>
    </ul>
    <h1>Tools untuk dipelajari:</h1>
    <ul type="none">
        <li>Gulp</li>
        <li>NPM</li>
        <li>Js Lint</li>
    </ul>
    <h1>Pelajari juga:</h1>
    <ul type="disc">
        <li>JSON</li>
        <li>XML</li>
        <li>Markdown</li>
    </ul>
</body>
</html>
    3 (default) untuk simbol lingkaran cakram;
  • <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Unordered List</title>
</head>

<body>
    <h1>Bahasa Pemrograman untuk dipelajari:</h1>
    <ul type="square">
        <li>Javascript</li>
        <li>PHP</li>
        <li>Java</li>
        <li>Python</li>
        <li>Kotlin</li>
    </ul>
    <h1>Framework untuk dipelajari:</h1>
    <ul type="circle">
        <li>Vuejs</li>
        <li>Svelte</li>
        <li>Reactjs</li>
    </ul>
    <h1>Tools untuk dipelajari:</h1>
    <ul type="none">
        <li>Gulp</li>
        <li>NPM</li>
        <li>Js Lint</li>
    </ul>
    <h1>Pelajari juga:</h1>
    <ul type="disc">
        <li>JSON</li>
        <li>XML</li>
        <li>Markdown</li>
    </ul>
</body>
</html>
    4 tidak memakai simbol;
  • <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Unordered List</title>
</head>

<body>
    <h1>Bahasa Pemrograman untuk dipelajari:</h1>
    <ul type="square">
        <li>Javascript</li>
        <li>PHP</li>
        <li>Java</li>
        <li>Python</li>
        <li>Kotlin</li>
    </ul>
    <h1>Framework untuk dipelajari:</h1>
    <ul type="circle">
        <li>Vuejs</li>
        <li>Svelte</li>
        <li>Reactjs</li>
    </ul>
    <h1>Tools untuk dipelajari:</h1>
    <ul type="none">
        <li>Gulp</li>
        <li>NPM</li>
        <li>Js Lint</li>
    </ul>
    <h1>Pelajari juga:</h1>
    <ul type="disc">
        <li>JSON</li>
        <li>XML</li>
        <li>Markdown</li>
    </ul>
</body>
</html>
    5 untuk simbol lingkaran;

Contoh

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Unordered List</title>
</head>

<body>
    <h1>Bahasa Pemrograman untuk dipelajari:</h1>
    <ul type="square">
        <li>Javascript</li>
        <li>PHP</li>
        <li>Java</li>
        <li>Python</li>
        <li>Kotlin</li>
    </ul>
    <h1>Framework untuk dipelajari:</h1>
    <ul type="circle">
        <li>Vuejs</li>
        <li>Svelte</li>
        <li>Reactjs</li>
    </ul>
    <h1>Tools untuk dipelajari:</h1>
    <ul type="none">
        <li>Gulp</li>
        <li>NPM</li>
        <li>Js Lint</li>
    </ul>
    <h1>Pelajari juga:</h1>
    <ul type="disc">
        <li>JSON</li>
        <li>XML</li>
        <li>Markdown</li>
    </ul>
</body>
</html>

Hasil

Cara menggunakan fungsi

Selain menggunakan type, kita juga bisa menggunakan gambar

Ini dilakukan dengan gaya CSS

Sebagai contoh

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Unordered List</title>
</head>

<body>
    <h1>Bahasa Pemrograman untuk dipelajari:</h1>
    <ul style="list-style-image: url(https://assets.ubuntu.com/sites/ubuntu/latest/u/img/favicon.ico)">
        <li>Javascript</li>
        <li>PHP</li>
        <li>Java</li>
        <li>Python</li>
        <li>Kotlin</li>
    </ul>
</body>
</html>

Hasil

Cara menggunakan fungsi

3. Deskripsi Daftar dalam HTML

Description List adalah daftar yang berisi keterangan atau penjelasan tentang sesuatu

Ada tiga tag yang digunakan untuk membuat daftar deskripsi

  • <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Unordered List</title>
</head>

<body>
    <h1>Bahasa Pemrograman untuk dipelajari:</h1>
    <ul type="square">
        <li>Javascript</li>
        <li>PHP</li>
        <li>Java</li>
        <li>Python</li>
        <li>Kotlin</li>
    </ul>
    <h1>Framework untuk dipelajari:</h1>
    <ul type="circle">
        <li>Vuejs</li>
        <li>Svelte</li>
        <li>Reactjs</li>
    </ul>
    <h1>Tools untuk dipelajari:</h1>
    <ul type="none">
        <li>Gulp</li>
        <li>NPM</li>
        <li>Js Lint</li>
    </ul>
    <h1>Pelajari juga:</h1>
    <ul type="disc">
        <li>JSON</li>
        <li>XML</li>
        <li>Markdown</li>
    </ul>
</body>
</html>
    6 (daftar deskripsi) tag untuk memulai daftar deskripsi;
  • <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Unordered List</title>
</head>

<body>
    <h1>Bahasa Pemrograman untuk dipelajari:</h1>
    <ul type="square">
        <li>Javascript</li>
        <li>PHP</li>
        <li>Java</li>
        <li>Python</li>
        <li>Kotlin</li>
    </ul>
    <h1>Framework untuk dipelajari:</h1>
    <ul type="circle">
        <li>Vuejs</li>
        <li>Svelte</li>
        <li>Reactjs</li>
    </ul>
    <h1>Tools untuk dipelajari:</h1>
    <ul type="none">
        <li>Gulp</li>
        <li>NPM</li>
        <li>Js Lint</li>
    </ul>
    <h1>Pelajari juga:</h1>
    <ul type="disc">
        <li>JSON</li>
        <li>XML</li>
        <li>Markdown</li>
    </ul>
</body>
</html>
    7 (istilah deskripsi) tag untuk membuat kata-kata yang akan dijelaskan;
  • <!DOCTYPE html>
<html lang="en">
<head>
    <title>Membuat Unordered List</title>
</head>

<body>
    <h1>Bahasa Pemrograman untuk dipelajari:</h1>
    <ul type="square">
        <li>Javascript</li>
        <li>PHP</li>
        <li>Java</li>
        <li>Python</li>
        <li>Kotlin</li>
    </ul>
    <h1>Framework untuk dipelajari:</h1>
    <ul type="circle">
        <li>Vuejs</li>
        <li>Svelte</li>
        <li>Reactjs</li>
    </ul>
    <h1>Tools untuk dipelajari:</h1>
    <ul type="none">
        <li>Gulp</li>
        <li>NPM</li>
        <li>Js Lint</li>
    </ul>
    <h1>Pelajari juga:</h1>
    <ul type="disc">
        <li>JSON</li>
        <li>XML</li>
        <li>Markdown</li>
    </ul>
</body>
</html>
    8 (deskripsi deskripsi) tag untuk membuat penjelasan dari kata tersebut

Format penulisannya seperti ini

Cara menggunakan fungsi

Contoh

<!DOCTYPE html>
<html lang="en">

<head>
    <title>Membuat Description List</title>
</head>

<body>
    <h1>Daftar istilah:</h1>
    <dl>
        <dt>Kopi</dt>
        <dd>Sebuah minuman berwarna hitam. Menurut pendapat lain kopi adalah air yang dimasak sampai gosong.</dd>
        <dt>Kopi Black Magic</dt>
        <dd>Kopi hitam atau kopi tradisional yang dibuat dengan mantra-mantra.</dd>
        <dt>White Coffee</dt>
        <dd>Kopi berwarna putih, kandungan kafeinnya sedikit.</dd>
        <dt>Kopi++</dt>
        <dd>Kopi ini mampu meningkatkan imajinasi 99 kali lipat.</dd>
    </dl>
</body>

</html>

Hasil

Cara menggunakan fungsi

Daftar dalam Daftar (Daftar Bersarang)

Daftar juga dapat dibuat di dalam daftar, misalnya kita ingin menggabungkan daftar berurut dengan daftar tidak berurut

Apa itu DD dalam HTML?

dd menampilkan Definisi Deskripsi atau penjelasan dari suatu istilah/istilah . Tag HTML

Bagaimana cara membuat daftar deskripsi dalam HTML?

Untuk membuat Daftar Deskripsi, seluruh daftar harus berada di dalam pasangan tag . Untuk setiap deskripsi atau judul istilah, kita menggunakan tag

Apa fungsi DT?

Imunisasi DT (difteri tetanus) adalah imunisasi yang diberikan untuk mencegah beberapa penyakit menular seperti difteri, tetanus, dan batuk rejan (pertusis).

Apa itu DT HTML?

Elemen menunjukkan Istilah Definisi yang digunakan untuk mewakili istilah pada daftar definisi (Daftar definisi (

kode html

Pos Terkait

Cara menggunakan truncate list python
Cara menggunakan truncate list python

Cara mengalihkan pengguna di meja kerja mysql
Cara mengalihkan pengguna di meja kerja mysql

Cara menggunakan koneksi database mysql
Cara menggunakan koneksi database mysql

Bagaimana Anda menghapus objek dalam javascript?
Bagaimana Anda menghapus objek dalam javascript?

Bagaimana cara menjumlahkan array baris dengan python?
Bagaimana cara menjumlahkan array baris dengan python?

Cara menggunakan copy down google sheets
Cara menggunakan copy down google sheets

Mengubah posisi gambar di html
Mengubah posisi gambar di html

Cara menggunakan class method python
Cara menggunakan class method python

Cara menggunakan javascript load external script
Cara menggunakan javascript load external script

Buat pdf dan kirim sebagai lampiran php
Buat pdf dan kirim sebagai lampiran php

Periklanan

BERITA TERKINI

Cara menggunakan mysql timestamp from string
1 years ago . by ShavenBrainstorming
Langkah langkah membuat web menggunakan HTML dan CSS?
1 years ago . by OverheatedCabbage
Bagaimana cara mengonversi file txt ke google sheets?
1 years ago . by DeprivedAppeasement
Bagaimana Anda mengganti huruf tertentu dengan python?
1 years ago . by FunctioningApartheid
Apa upaya kita untuk mengatasi krisis air bersih?
1 years ago . by BeardedAnnoyance
Bagaimana cara membekukan area yang dipilih di excel?
1 years ago . by CrackingMolasses
Bagaimana Anda mengonversi bilangan bulat negatif menjadi byte dengan python?
1 years ago . by Wage-priceAccomplice
Apakah infeksi bakteri pada Miss V bisa sembuh sendiri?
1 years ago . by FrayedDaddy
Database mana yang digunakan di phpmyadmin?
1 years ago . by ParamountCounselor
Cara menggunakan semua jenis acara javascript
1 years ago . by CondemnedMirth

Toplist Popular

#1
Top 7 unterschied griechischer joghurt und joghurt griechischer art 2022
1 years ago
#2
Top 9 ibc container 600 liter gebraucht 2022
1 years ago
#3
Top 7 excel hintergrundfarbe auslesen ohne vba 2022
1 years ago
#4
Top 6 dji mavic air 2 wann welcher filter 2022
1 years ago
#5
Top 7 rosen schwarze flecken am stiel 2022
1 years ago
#6
Top 8 wann wird es wieder später dunkel 2022 2022
1 years ago
#7
Top 6 em nome do pai em nome do filho 2022
1 years ago
#8
Top 8 zdf neben der spur -- erlöse mich 2022
1 years ago
#9
Top 8 como melhorar dor no calcanhar 2022
1 years ago
#10
Top 7 vinho é bom para pressão alta 2022
1 years ago

Periklanan

Terpopuler

Periklanan

Tentang Kami

Legal

Dukungan

Social

homeendejahikoptzhth
Copyright © 2024 ketajaman Inc.