Sign in Subscribe
HTML

Format Teks, Komentar, Tautan, Gambar, dan Atribut di HTML

Format Teks, Komentar, Tautan, Gambar, dan Atribut di HTML
Photo by Dominik Malinowski / Unsplash

Menguasai HTML itu penting banget buat kamu yang pengen bikin website keren. Beberapa elemen dasar yang wajib kamu tahu meliputi format teks, komentar, tautan, gambar, dan atribut. Yuk, kita bahas satu per satu!

1. Format Teks

HTML menyediakan berbagai tag untuk memformat teks agar tampilannya sesuai keinginan. Berikut beberapa tag yang sering digunakan:

<br>: Menyisipkan baris baru tanpa memulai paragraf baru.

Baris pertama.<br>Baris kedua.

<em>: Menampilkan teks dengan format miring, menandakan penekanan ringan.

<em>Teks ini dimiringkan.</em>

<strong>: Menampilkan teks dengan format tebal, menandakan penekanan kuat.

<strong>Teks ini ditebalkan.</strong>

<p>: Digunakan untuk membuat paragraf.

<p>Ini adalah sebuah paragraf.</p>

2. Komentar

Komentar dalam HTML berguna untuk memberikan catatan atau penjelasan dalam kode tanpa ditampilkan di browser. Ini membantu pengembang lain memahami kode yang kamu tulis.

<!-- Ini adalah komentar dan tidak akan ditampilkan di browser -->

3. Tautan (Link)

Tautan memungkinkan pengguna berpindah dari satu halaman ke halaman lain. Tag <a> digunakan untuk membuat tautan, dengan atribut href menentukan alamat tujuan.

<a href="https://www.contoh.com">Kunjungi Contoh</a>

Kamu juga bisa menambahkan atribut target untuk menentukan bagaimana tautan dibuka:

  • _self: Membuka tautan di tab atau jendela yang sama (default).
  • _blank: Membuka tautan di tab atau jendela baru.
<a href="https://www.contoh.com" target="_blank">Buka di tab baru</a>

4. Gambar

Untuk menampilkan gambar di halaman web, gunakan tag <img> dengan atribut src untuk menentukan sumber gambar dan alt untuk teks alternatif jika gambar tidak bisa ditampilkan.

<img src="gambar.jpg" alt="Deskripsi gambar">

Kamu juga bisa mengatur ukuran gambar dengan atribut width dan height:

<img src="gambar.jpg" alt="Deskripsi gambar" width="300" height="200">

5. Atribut

Atribut memberikan informasi tambahan pada tag HTML dan ditempatkan di dalam tag pembuka. Beberapa atribut umum meliputi:

  • href: Menentukan URL tujuan dalam tag <a>.
  • src: Menentukan sumber file dalam tag <img>.
  • alt: Memberikan teks alternatif untuk gambar.
  • title: Memberikan informasi tambahan yang muncul saat kursor diarahkan ke elemen.
  • style: Menambahkan CSS inline untuk elemen.
<p title="Ini adalah tooltip">Arahkan kursor ke teks ini.</p>

Dengan memahami dan menguasai elemen-elemen dasar ini, kamu bisa membangun halaman web yang lebih interaktif dan informatif. Jangan lupa untuk selalu menulis kode dengan rapi dan terstruktur agar mudah dipahami dan dikelola di kemudian hari.

Read next