Docs/HTML/Attributes

HTML Attributes

Atribut memberikan informasi tambahan pada elemen HTML. Ditulis di dalam tag pembuka.

Atribut Global (bisa dipakai di semua elemen)

  • id — identifier unik
  • class — nama class untuk CSS/JS
  • style — inline CSS
  • title — tooltip saat hover
  • hidden — menyembunyikan elemen
  • data-* — atribut data kustom
  • tabindex — urutan tab navigasi
  • contenteditable — membuat elemen bisa diedit
  • draggable — membuat elemen bisa di-drag

Aturan Penulisan

  • Selalu gunakan huruf kecil
  • Nilai atribut dibungkus tanda kutip (disarankan double quotes)
  • Boolean attribute cukup ditulis namanya saja: disabled, required
index.html
Try It →
<h2>Attribute Examples</h2>

<!-- id dan class -->
<p id="intro" class="highlight">
  Elemen ini punya id="intro" dan class="highlight"
</p>

<!-- title (hover tooltip) -->
<p title="Ini tooltip yang muncul saat hover">Hover di atas teks ini!</p>

<!-- contenteditable -->
<div contenteditable="true">
  Klik di sini dan coba ketik sesuatu! Elemen ini bisa diedit.
</div>

<!-- data attributes -->
<button data-action="save" data-id="123" onclick="alert('data-id: ' + this.dataset.id)">
  Klik (data-id: 123)
</button>

<!-- hidden -->
<p>Elemen di bawah ini di-hidden:</p>
<p hidden>Kamu tidak bisa melihat ini!</p>
← Previous
Semantic HTML
Next →
Comments