Macam-Macam Tag HTML Dengan Fungsinya – Bagi yang baru belajar HTML, hal ini bisa dikatakan mudah atau sulit. Sebelum kita mempelajari secara mendalam tentang HTML, terlebih dahulu kita harus memahami apa itu HTML dan apa fungsinya. HTML adalah elemen dasar untuk membangun pondasi atau membuat website. Tidak hanya bangunan seperti gedung atau sekolah, web juga membutuhkan pondasi yang kuat, karena website yang sering kita kunjungi terbuat dari kumpulan bahasa HTML.
HTML (Hyper Text Markup Language) adalah bahasa pemrograman yang berguna untuk membuat halaman website. Dalam dunia pemrograman berbasis website (web programming), bahasa HTML merupakan salah satu dasar utama untuk membangun sebuah website, file HTML dapat disimpan dengan bentuk (ekstensi)
HTML dapat diakses menggunakan web browser seperti Google Chrome, Opera, Mozilla Firefox, IE (Internet Explorer), Safari dan web browser lainnya. Jika kita ingin membuat website tidak cukup hanya menggunakan HTML tetapi kita juga membutuhkan PHP, CSS dan JavaScript untuk membuat halaman website yang energik, jika kita hanya menggunakan HTML maka website kita akan terlihat mati karena tidak memiliki fungsi-fungsi yang dapat mengelola website. Tentunya developer merasa perlu mengganti file HTML ketika ingin mengupdate artikel baru
Pada artikel sebelumnya, kita telah membahas tentang editor teks terbaik yang terkait dengan artikel ini. Sekarang kita akan membahas apa itu tag, elemen, dan atribut serta contohnya dalam HTML
Tag, elemen, dan atribut dalam HTML merupakan komponen dasar HTML dalam membuat website. Itu sebabnya Anda perlu mempelajari ketiga hal ini jika Anda ingin mempelajari HTML lebih lanjut
Daftar isi
Apa itu Tag HTML?
Pengertian tag HTML adalah tanda dalam HTML yang berfungsi untuk mengirimkan perintah-perintah tertentu yang akan dilakukan oleh web browser. Urutan yang dikirim juga berbeda-beda, tergantung isi tag yang diketik
Tag itu diapit dengan kurung siku (). Tag HTML ada yang memiliki penutup, ada yang hanya berupa pembuka.
Namun untuk tag yang tidak memiliki cap, sangat disarankan untuk menambahkan garis miring di akhir nama tag. Itu karena jika satu tag (tanpa penutup) tidak diberi garis miring, itu tidak akan dianggap sebagai tag di XHTML
Kesalahannya ada di sampulnya, seharusnya seperti ini
Ini huruf tebalIni huruf miring
_
Tag ini bisa diartikan sebagai perintah dalam bahasa markup HTML. Untuk sebab itu penulisannya harus benar sesuai dengan yang sebenarnya. Tag dalam HTML bersifat in-case sensitive. Itu artinya, tag dengan tag akan dianggap sama.
Setelah membahas apa itu tag dalam HTML, sekarang kita akan membahas pengertian elemen dan contohnya dalam HTML
Apa itu Elemen?
Jika sebelumnya kita belajar tentang tag, maka sekarang kita belajar tentang elemen. Elemen adalah karakter yang ada di dalam tag (dari tag pembuka hingga tag penutup). Misalnya seperti ini
Makinrajin
Nah, untuk tulisan “Makinrajin” itu termasuk ke dalam element . Intinya, apapun yang berada di dalam sebuah tag pembuka dan tag penutup itulah yang dinamakan dengan element.
Hubungan antar elemen dalam HTML terbagi menjadi 5 jenis, apa saja jenisnya?
1. Elemen Induk
Dilihat dari namanya saja, dapat diketahui bahwa elemen induk adalah elemen yang menjadi 'induk' dari elemen yang berada di dalam elemen tersebut. Elemen induk adalah elemen yang memiliki elemen lain di dalamnya tepat pada satu level. Untuk lebih jelasnya, Anda dapat melihat kode program di bawah ini
Judul Makinrajin
Pertama
Kedua
Dalam kasus di atas, tag
adalah parent element dari tag . Tag juga merupakan parent element dari tag
. Tetapi, perlu diingat bahwa tag bukan merupakan parent element dari tag
. Itu karena, tag bukan ‘orang tua / parent’ dari tag
, tetapi ‘kakek’nya tag
.
Yang menjadi parent element dari tag
adalah tag
sendiri. Sekarang Anda sudah mengerti konsep parent element ? Kalau iya sekarang kita lanjut ke child element.
2. Elemen Anak
Elemen anak adalah kebalikan dari elemen induk. Jika elemen induk adalah 'induk' langsung dari suatu elemen, maka elemen anak adalah 'anak' langsung dari suatu elemen
Judul Makinrajin
Pertama
Kedua
Jika dalam parent element, tag
adalah parent element dari tag , maka sekarang terbalik. Tag adalah child element dari tag . Begitu juga dengan tag lain. Tetapi, tag
tetap bukan child element dari tag , melainkan dari tag
. Karena tag
bukan anaknya tag .
3. Elemen Saudara
Kata saudara kandung memiliki arti saudara kandung. Jadi, yang termasuk dalam unsur saudara kandung adalah unsur yang memiliki saudara kandung (satu ayah dan satu ibu) atau dengan kata lain anak kandung dari ayah dan ibu tersebut. Anda dapat melihat contoh kode program di bawah ini
Judul Makinrajin
Pertama
Kedua
Satu
Dua
Masih ingat tadi, sibling adalah saudara kandung. Jadi, penerapan di kode program HTML adalah tag
dan tag HTML
adalah sibling element. Karena mereka berada langsung di dalam tag . Berbeda dengan tag dengan tag
, mereka bukan sibling element tetapi ‘orang tua’ dengan ‘anaknya’.
Jadi Anda sudah memahami hubungan antar elemen dalam HTML?
4. Elemen Leluhur
Sekarang saya bertanya kepada Anda, apa yang dimaksud dengan leluhur? . Jadi kalau di dalam tag HTML, ancestor adalah elemen yang mengandung elemen lain di dalam elemen tersebut. Lihat saja contoh kode programnya
Judul Makinrajin
Pertama
Kedua
Satu
Dua
Jadi, dalam contoh di atas bisa diartikan bahwa tag merupakan ancestor dari tag
, , , ,
,
dan apapun yang terletak di dalam tag itu sendiri. Begitu juga dengan tag yang merupakan ancestor element dari tag . Sudah paham kan ?
5. Elemen Keturunan
Keturunan berarti keturunan. Jadi, maksudnya adalah suatu unsur dapat dikatakan sebagai unsur keturunan bila unsur tersebut termasuk dalam keturunan unsur lain. Agar lebih jelas, Anda dapat mengamati sintaks di bawah ini
Judul Makinrajin
Pertama
Kedua
Satu
Dua
Contoh kode program di atas agak saya ubah dari contoh sebelumnya supaya Anda bisa paham ketika diubah polanya. Dalam contoh sintaks di atas, tag merupakan descendant element dari tag
,
, , dan . Perlu diingat, tag bukan termasuk descendant element dari tag
dan ya. Karena tag HTML tidak berada di dalam tag
maupun .
Apa itu Atribut dalam HTML?
Sebenarnya, apa arti dari atribut itu? . Kunci dari atributnya adalah name=”value”. Jika terdapat name=”value” pada sebuah tag, maka dapat dikatakan bahwa tag tersebut memiliki atribut
Contoh penggunaan atribut
_
Nah, untuk width=”100% itu adalah atribut dari tag
yang artinya akan diberi width (lebar) sebanyak 100%. Width adalah name nya dan 100% adalah valuenya. Ketika Anda sudah menggunakan css external, maka Anda akan sering menggunakan atribut id dan class. Contoh :
_
Itu adalah contoh penggunaan class dengan memanggil class red-button yang sudah Anda buat sebelumnya di CSS. Kami telah menyiapkan panduan belajar CSS untuk Anda agar Anda dapat mendesain website dengan baik
Sekarang Anda telah selesai mempelajari tentang apa itu tag, elemen, dan atribut dalam HTML. Sekarang saatnya bagi Anda untuk melanjutkan bab pembelajaran HTML berikutnya
Tag Judul adalah elemen HTML yang digunakan untuk membuat judul halaman web . Tag Judul digunakan oleh mesin pencari sebagai judul daftar pencarian, yang digarisbawahi dengan hyperlink biru.