Tag, Elemen, dan Atribut HTML

By Labels: at

Assalamu’alaikum Wr. Wb

Pengantar

Hai bagaimana kabar? Semoga baik-baik saja ya teman-teman. Artikel sebelumnya sudah membahas tentang Web Browser yang bisa digunakan untuk keperluan program dan untuk hal-hal yang lain. Selanjutnya artikel yang dibahas yaitu tentang yang berhubungan dengan Tag, Elemen, dan Atribut pada HTML. Apa ada yang sudah tau? Atau sudah ada yang pernah coba.
 
Saya yakin banyak dari teman-teman pasti tau tag, element, dan atribut HTML, untuk menulis kode-kode HTML yang akan kita buat, minimal kita diawal harus tau tentang pengertian Tag, Element, dan Atribut agar tidak bingun pada saat menulis kode-kode HTML.
 
Tag, Elemen, dan Atribut HTML
 
  • Tag
    • Dalam bahasa markup HTML harus memberitahu kepada Web Browser apakah ditampilkan atau tidak. Tag adalah untuk menandai awal elemen HTML dan biasanya diapit oleh kurung sudut. Contoh : <h1> 
    • Tag harus dibuka <h1> dan ditutup </h1> agar dapat berfungsi.
    • Berikut adalah format dasar penulisan tag HTML:
    •  
    • <tag_pembuka>objek yang mau ditulis</tag_penutup> 
    • Perhatikan Contoh kode HTML berikut ini : 
    •  
    • <p>Ini adalah sebuah paragraf</p> 
      • Tag pembuka : terdiri dari elemen (dalam contoh ini, p untuk paragraf).
      • Isi : isi dari elemen (dalam contoh, ini adalah sebuah paragraf). 
      • Tag penutup : ini sama dengan tag pembuka, hanya menyertai garis miring </>.
 
Catatan : Terdapat pengecualian beberapa tag yang tidak berpasangan seperti <br> untuk break (pindah baris) atau <hr> untuk horizontal line (garis horizontal). Tag ini dikenal dengan sebutan self closing tag atau void tag. Untuk penulisan <br>, atau <br />.

  • Elemen
    • Isi dari tag yang berada diantara tag pembuka dan tag penutup, termasuk tag itu sendiri dan atribut yang dimilikinya (jika ada).
    • Contoh : <p> Ini adalah sebuah paragraf </p>
    • Contoh di atas, <p> Ini adalah sebuah paragraf </p> merupakan elemen p 
    •  
      Gambar 1
  •  Atribut
    • Atribut berisi informasi tambahan. Atribut berupa tag pembuka dan info tambahan ditempatkan di dalam.
    • Contoh :
    •  
      Gambar 2

    • Yang tulisan “http://www.alamicomputer.com” merupakan atribut yang berada pada code a (hyperlink).

    • Atribut harus memiliki :
      • Nama atribut, diikuti dengan tanda yang sama.  
      • Nilai atribut, dibungkus dengan tanda kutip pembuka dan penutup. 
 
 Praktek HTML
 Contoh kode html dibawah ini :
Gambar 3

Keterangan :

<!Doctype html> : adalah string karakter terpendek yang dihitung sebagai doctype yang valid.

<html> : tag ini menandai bahwa akan menulis seluruh kode-kode html.

<head> : sebagai ‘penampung’ berbagai tag yang tidak akan terlihat di web browser.

<meta> : meta singkatan dari metadata. Metadata adalah data yang berisi informasi dokumen.

<title> : mewakili judul dokumen atau nama terlihat di web browser. 

<body> : mewakili isi utama dari suatu dokumen html.

<h1> : singkatan dari “header1”, yang digunakan untuk membuat judul di dalam HTML. tersedia <h1>, <h2>, <h3>, <h4>, <h5>, <h6>.

<p> : singkatan dari paragraf yang digunakan membuat paragraf.    


HTML History

Gambar 4

Kesimpulan

Pada pembahasan tentang HTML (Hypeterxt Markup Language) yang kontennya adalah tag, elemen, dan atribut HTML merupakan awal perkenalan bahasa Markup atau HTML untuk mengetahui lebih lanjut, diperlukan mengetahui maksud arti kata tersebut agar tidak terjadi kesalahan pemahaman tentang HTML.

Jadi untuk lanjut ke artikel-artikel selanjutnya teman-teman bisa membaca ulang tulisan ini dengan teliti, pahami, lalu praktekan. Jika ada kesulitan teman-teman bisa tanyakan di kolom komentar pada website kami.

Terima kasih sudah berkunjung sampai ketemu di artikel selanjutnya, jangan lupa ikuti kanal chanel kami

Youtube Alami Computer 

Website alamicomputer.com

Instagram chaerullah.fadli


Posting Komentar
Berkomentar dengan baik dan benar

Back to Top