Elemen HTML


Merupakan kesatuan yang digunakan untuk memarkup dan membangun dokumen html itu sendiri. Penggunaan elemen HTML diawali dengan tag dan diakhiri dengan tag pula. Diantara kedua tag tersebut terdapat konten yang nantinya akan ditampilkan pada web browser.

<nama_tag> .... </nama_tag>

Contoh penerapan element HTML

Tag Pembuka Konten Tag Penutup
<h1> Belajar HTML </h1>
<p> Hello World! </p>

Perlu diingat tag penutup elemen harus ditulis dengan tanda slash (/). Elemen HTML juga tidak bersifat case sensitive namun pada umumnya penulisan elemen html menggunakan lowercase atau huruf kecil.


Perbedaan Istilah Elemen dengan Tag


Tag merupakan sebuah teks yang berguna untuk memberitahukan pada browser bagaimana suatu konten akan ditampilkan. Misal kita akan menampilkan kata atau kalimat dengan ukuran besar sebagai judul, bisa menggunakan tag <h1>, <h2>, <h3>, dst.

Sedangkan disebut elemen bila segalanya dari tag pembuka sampai tag penutup. Jadi misalnya terdapat contoh

<p> Hello World </p>

Maka tag <p> termasuk kesatuan dari elemen tersebut. Apakah elemen harus memiliki tag pembuka, konten, dan tag penutup? Simak pembahasan selanjutnya.


Elemen Kosong HTML


Namun begitu ada istilah yang disebut elemen kosong. Istilah ini diperuntukkan untuk elemen yang hanya memiliki tag pembuka tanpa konten dan tag penutup. Beberapa elemen kosong html yang sering digunakan seperti tag <br> dan tag <hr>.

Selain <br> dan <hr> elemen-elemen berikut juga bisa dikatakan elemen kosong.

Elemen Keterangan
<area> Menentukan area di dalam peta gambar
<base> Menentukan URL dasar dari sebuah dokumen
<br> Membuat baris baru
<col> Menentukan properti dari setiap kolom di dalam elemen <colgroup>
<embed> Menyajikan wadah untuk integrasi aplikasi eksternal (selain HTML)
<hr> Memisahkan sebuah konten atau paragraf berdasarkan tema atau topik masing-masing
<img> Menyisipkan gambar
<input> Mendefinisikan kolom input
<keygen> Membuat key-pair generator untuk kolom input
<link> Mengintegrasikan antara dokumen HTML dan resource eksternal
<meta> Mendefinisikan meta data dokumen HTML
<param> Mendefinisikan parameter untuk sebuah objek
<source> Mendefinisikan lebih dari satu sumber daya media untuk elemen media (<audio> atau <video>)
<track> Menampilkan teks trek untuk elemen media (<audio> atau <video>)
<wbr> Menentukan kemungkinan baris baru

Elemen HTML Bersarang


Elemen HTML dapat juga disebut elemen bersarang jika di dalam satu elemen tersebut terdapat elemen lain di dalamnya. Contoh mudahnya dapat disimak pada struktur default HTML. Dimana elemen html mengurung elemen <head> dan elemen <body>.

<html>
<head>
    <title> Belajar HTML </title>
</head>
<body>
    <p> <strong> Hello </strong> <em> World </em> </p>
</body>
</html>

Termasuk juga elemen <head> dan elemen <body> juga dapat disebut elemen bersarang.

<head>
    <title> Belajar HTML </title>
</head>
<body>
    <p> <strong> Hello </strong> <em> World </em> </p>
</body>

Bagaimana dengan elemen <p>? yah elemen <p> juga bisa dikatakan elemen bersarang, karena elemen <p> mengapit elemen <em> dan <strong>.

<p> <strong> Hello </strong> <em> World </em> </p>