HTMl5 Details Dialog Canvas SVG Inline

Ringkasan

HTML5 membawa elemen interaktif tanpa JS berat: <details>/<summary> (disclosure), <dialog> (modal), <canvas> (bitmap), <svg> (vektor inline).

Konsep Dasar

• <details><summary> — konten tersembunyi bisa dibuka tanpa JS.
• <dialog> — modal/non-modal; buka via showModal().
• <canvas> — gambar via JS (getContext('2d')).
• <svg> — grafik vektor, scalable, bisa di-style CSS.

Cara Kerja / Struktur

html

<details><summary>FAQ</summary><p>Jawabannya di sini.</p></details>
<dialog id="d"