Tutorial Belajar Elemen HTML di HTML


Sebuah elemen HTML umumnya tersusun dari tag pembuka dan tag penutup, dengan konten yang disimpan diantara keduanya.
<namatag>Konten di dalam tag</namatag>
Tag HTML adalah nama dari elemen HTML, ditulis di antara tanda kurung sudut < dan >, misalnya <h1> dan <p>.
Tag penutup ditulis seperti tag pembuka, dengan diawali karakter garis miring /sebelum nama tagnya, misalnya </h1> dan </p>.
Konten elemen adalah semua konten yang ada di antara tag pembuka dan tag penutup.
Tag mendefinisikan maksud konten yang ada di dalamnya. Ketika kita menuliskan sebuah konten menggunakan tag <h1>, misalnya <h1>Halo Coder!</h1> berarti kita mendefinisikan konten "Halo Coders!" sebagai sebuah heading besar. Ketika kita menulis konten di dalam tag <p> maka berarti kita mendefinisikan konten tersebut sebagai sebuah paragraf.
Tag sendiri tidak akan ditampilkan di browser. Tag hanya menjadi pengenal untuk browser dalam menentukan seperti apa sebuah konten ditampilkan. Misalnya, ketika kita menulis <strong>Kereeen!</strong>, maka konten di dalam tag tersebut akan ditampilkan sebagai tulisan yang dicetak tebal, seperti ini:
Kereen!
Meski demikian tidak semua elemen html ditulis dengan tag pembuka dan penutup. Ada juga elemen yang ditulis tanpa penutup, misalnya:

<br />


<img src="image.jpg" />

Elemen <br> dan <img> di atas tidak memiliki tag penutup, melainkan menutup dirinya sendiri dengan diakhiri karakter />.

PRAKTEK

  • Pada editor terdapat contoh kode HTML dengan konten elemen <h1>sebagai contoh elemen yang memiliki tag pembuka dan penutup, dan elemen <img> yang tidak memiliki tag penutup. Jalankan kode dan lihat hasil tampilannya di kolom output.
  • Tambahkan elemen <p> setelah baris elemen <h1> dan isi kontennya dengan teks "Ini gambar anjing". Jalankan kembali kode program.

<!DOCTYPE html>
<html>
<head>
<title>Belajar HTML</title>
</head>
<body>
   <h1>Contoh Elemen HTML</h1>
       <img src="https://i.imgur.com/s2YreFg.jpg" />
</body>
</html>
Hasilnya:
Contoh Elemen HTML
 

Subscribe to receive free email updates:

0 Response to "Tutorial Belajar Elemen HTML di HTML"

Posting Komentar