Ads by Yasya El Hakim
Elemen pada HTML

Elemen pada HTML biasanya terdiri dari Start Tag dan End Tag, dan kontennya berada diantara tag tersebut.
<namatag>Konten</namatag>

Semua elemen HTML harus diawali dengan Start Tag dan End Tag:
<p>Paragraf</p>

Start Tag Konten End Tag
<h1> Isi Konten </h1>
<p> Isi Konten </p>
<br>

Elemen HTML yang tidak memilki konten dinamakan Empty Elements (Elemen Kosong). Empty Element tidak memiliki End Tag, seperti Tag <br> yang dapat digunakan untuk membuat baris (Line Break).

Elemen yang Menggabung

Elemen pada HTML dapat digabungkan menjadi satu (Elemen dapat memiliki Elemen).
Semua dokumen HTML terdiri dari Elemen yang menggabung.

Berikut adalah contoh empat elemen yang menggabung menjadi satu:
<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html> 
See the Pen 08. Elemen HTML by Yasya El Hakim (@elhakimyasya) on CodePen.

Penjelasan

Elemen <html> menunjukkan bahwa dokumen tersebut adalah HTML.
Element tersebut memiliki Start Tag <html> dan End Tag </html>.
Di dalam elemen <html> terdapat elemen <body>.
<html>
<body>

<h1>Heading</h1>
<p>Paragraf.</p>

</body>
</html>

Elemen <body> menunjukkan lokasi dokumen HTML yang dapat dilihat.
Elemen tersebut memiliki Start Tag <body> dan End Tag </body>.
Didalam elemen <body> terdapat dua elemen lagi yaitu <h1> dan </p>.
<body>

<h1>Heading</h1>
<p>Paragraf.</p>

</body>

Elemen <h1> merupakan sebuah Heading.
Elemen tersebut memiliki Start Tag <h1> dan End Tag </h1>.
Konten dari elemen tersebut adalah: Heading.
<h1>Heading</h1>

Elemen <p> merupakan sebuah paragraf.
Elemen tersebut memiliki Start Tag <p> dan End Tag </p>.
Konten dari elemen tersebut adalah: Paragraf.
<p>Paragraf.</p>

Jangan Lupakan End Tag

Beberapa elemen HTML akan terlihat sempurna walaupun kalian melupakan End Tag:
<html>
<body>

<p>Paragraf 1
<p>Paragraf 2

</body>
</html> 
See the Pen 09. Elemen HTML Tanpa End Tag by Yasya El Hakim (@elhakimyasya) on CodePen.

Kode diatas akan bekerja pada semua jenis Browser karena End Tag merupakan opsional.

Catatan: Jangan praktekkan contoh kode diatas. Jika kalian mempraktekkan nya, mungkin kalian akan mendapatkan hasil yang salah.

Empty Element pada HTML

Elemen HTML yang tidak memiliki konten dinamakan Empty Element (Elemen Kosong).
<br> (Line Break) merupakan salah satu Empty Element karena tidak memiliki End Tag/Closing Tag (<br> berfungsi untuk membuat baris baru):
<p>Ini adalah <br> paragraf yang menggunakan Line Break.</p> 
See the Pen 10. Elemen br by Yasya El Hakim (@elhakimyasya) on CodePen.

Empty Element dapat "Ditutup" seperti <br/>.

Pada HTML5, kalian tidak perlu menutup Empty Element, tetapi jika kalian melakukan validasi, atau jika kalian ingin dokumen dapat dibaca oleh XML Parser, kalian harus menutup semua Empty Element.

HTML Tidak Case Sensitive

Tag pada HTML tidaklah Case Sensitive, artinya kalian bisa menggunakan huruf besar maupun kecil. Contoh: <P> sama saja dengan <p>, <H1> sama saja dengan <h1>.

Kami menyarankan agar kalian selalu menggunakan huruf kecil.

Kami selalu menggunakan huruf kecil pada setiap contoh di Blog ini, semua contoh dari W3SChool juga menggunakan huruf kecil.

Sebelumnya: Tutorial Lengkap HTML: Contoh Dasar HTML - Bagian 3
Selanjutnya: Tutorial Lengkap HTML: Atribut pada HTML - Bagian 5
Daftar Isi: Tutorial Lengkap HTML

Sumber: https://www.w3schools.com/

0Komentar

Sebelumnya Selanjutnya