DeretCode|

Tips, Trik dan Tutorial
Seputar IT, Coding, Internet Marketing, Keahlian, Pendidikan, Hobi Dan Lainnya
Night :

Tutorial Lengkap Belajar Html # Mengenal Apa Itu Elemen

advertisement
Mengenal apa itu elemen html

Pada artikel sebelumnya kita telah belajar mengenal beberapa atribut html yang sering digunakan dalam membuat halaman web.
Pada artikel kali ini kita akan belajar mengenal apa itu elemen.
Sebelumnya kita telah sedikit menyinggung apa itu elemen pada pembahasan tag html.
Kali ini kita akan membahas secara khusus mengenai elemen html itu sendiri.

Apa itu elemen html?

Elemen adalah sebuah area yang dibatasi oleh tag pembuka dan tag penutup.
Apa itu elemen html
Elemen mencakup tag pembuka, atribut, konten dan tag penutup.
Artinya satu pasang tag html (tag pembuka & tag penutup) sama dengan satu elemen html.

Elemen tidak hanya berisi teks saja, tapi elemen juga bisa berisi elemen lainnya.
Parent elemen htlm dan child elemen html

Apa itu parent elemen(Elemen Induk)

Parent element adalah element yang membungkus element lainnya, seperti pada gambar diatas element dengan <span> membungkus elemen <h1>  dan <p>.

Apa itu child elemen(Elemen Anak)

Kebalikan dari parent elemen, child elemen adalah elemen yang berada di dalam elemen lainnya, contohnya seperti gambar diatas, yang menjadi child elemen adalah elemen <h1>  dan <p>.

Kenapa harus dibikin seperti itu?

Tujuannya untuk mengelompokan elemen-elemen html. Misalnya kamu ingin memisahkan elemen-elemen penyusun header, sidebar, konten dan footer. maka caranya adalah dengan membungkus elemen-elemen tersebut dengan elemen lainnya.

Mengelompokan elemen html
Dokumen html menjadi terlihat rapi dan terstruktur
Selain itu, ketika kita ingin memberikan styling, misalnya pada elemen penyusun content, kita tidak perlu memberikan styling pada semua elemen content tapi cukup pada parent elemennya saja.
Styling elemen
Pada gambar diatas, secara otomatis elemen h1 dan article akan mengikuti elemen induknya (div), memiliki warna later belakang merah.
Ilustrasi elemen syling

Kesalahan dalam menulis elemen html

1. Elemen adalah sebuah area yang dibatasi tag pembuka dan penutup, artinya setiap kali kita membuat tag pembuka, kita wajib menutupnya.
Kesalahan dalam penulisan elemen
2. Selalu pastikan huruf besar dan huruf kecil pada tag pembuka sama dengan tag penutup.
Elemen Error
3. Elemen tidak boleh saling memotong dengan elemen lainnya(cross element)
Kesalahan-kesahan diatas dapat kita minimalisir dengan cara menggunakan teks editor yang mendukung autocomplete html, seperti notepad++, sublime, atom dan visualcode.
Tinggal kalian aktifkan atau install plugin autocomplete htmlnya pada teks editor tersebut.

Element html yang tidak dapat berdiri sendiri

Ada beberapa elemen yang tidak dapat berdiri sendiri atau wajib dibungkus menggunakan element tertentu.
Dintarnya
Child Elemen Parent Elemen
<li> <ul> atau <ol>
<input> <form>
<option> <select>
<td> dan <th> <tr>
<tr> <table>, <tbody>, thead> atau <tfooter>
<tbody>, thead> dan<tfooter> <table>



Sampai disini pembahasan kita tentang elemen html. Jika kalian merasa artikel ini bermanfaatkan, silahkan klik tombol bagikan dan jika ada pertanyaan atau ada hal yang ingin di sampaikan silahkan tulis di kolom komentar.
Good luck!
advertisement



0 Komentar untuk " Tutorial Lengkap Belajar Html # Mengenal Apa Itu Elemen"

Silahkan berkomentar dengan baik dan bijak!