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 :