Mastering HTML Attributes

Panduan Lengkap Struktur dan Fungsi Atribut pada Elemen Web

Mahasiswa: Muhammad Aminudin NPM: 2455208037

1. Apa Itu Atribut Sebenarnya?

Jika elemen HTML adalah Kata Benda (seperti mobil), maka atribut adalah Kata Sifat (seperti warna merah, merk Toyota). Atribut memberikan instruksi khusus kepada browser tentang bagaimana elemen tersebut harus berperilaku atau ditampilkan.

<tag nama-atribut="nilai"> Konten </tag>

2. Kategori Atribut HTML

Kategori: Global

class & id

Digunakan sebagai penanda elemen agar bisa diatur oleh CSS atau dimanipulasi JavaScript. id harus unik, sedangkan class bisa digunakan berkali-kali.

Kategori: Navigasi

href & target

Pada tag <a>, href menentukan alamat tujuan. Atribut target="_blank" digunakan untuk membuka link di tab baru.

Kategori: Media

src, alt, controls

src menentukan sumber file. alt adalah teks pengganti jika gambar rusak. controls memunculkan tombol play/pause pada video.

Kategori: Form

type, placeholder, required

Mengatur fungsi input (teks, password, email). placeholder memberikan petunjuk teks transparan di dalam kolom.

3. Atribut Khusus "Boolean"

Ada beberapa atribut yang tidak memerlukan nilai. Kehadirannya saja sudah mengaktifkan fungsinya.

  • disabled: Menonaktifkan tombol atau input.
  • readonly: Input hanya bisa dibaca, tidak bisa diubah.
  • required: Mewajibkan form diisi sebelum dikirim.

⚠️ Aturan Emas Penulisan:

  1. Selalu gunakan huruf kecil untuk nama atribut (meskipun HTML tidak case-sensitive, ini standar industri).
  2. Selalu gunakan tanda petik ("") untuk membungkus nilai atribut.
  3. Jangan ada spasi di sekitar tanda sama dengan (=).
kembali ke Menu dasbord →