HTML Tutorial

Atribut HTML memberikan informasi tambahan tentang elemen HTML.

Atribut HTML

  • Semua elemen HTML dapat memiliki atribut
  • Atribut memberikan informasi tambahan tentang elemen
  • Atribut selalu ditentukan di tag awal
  • Atribut biasanya datang dalam pasangan nama/nilai seperti: nama="nilai"

Atribut href

Tag <a> mendefinisikan hyperlink. Atribut hrefmenentukan URL halaman yang dituju tautan:

<a href="https://www.w3schools.com">Visit W3Schools</a>
Try it

Anda akan mempelajari lebih lanjut tentang tautan di bab Tautan HTML kami .

Atribut src

Tag <img> digunakan untuk menyematkan gambar di halaman HTML. Atribut srcmenentukan jalur ke gambar yang akan ditampilkan:

<img src="img_girl.jpg">
Try it

Ada dua cara untuk menentukan URL dalam src atribut:

1. URL Absolut: Tautan ke gambar eksternal yang dihosting di situs web lain. Contoh: src="https://www.w3schools.com/images/img_girl.jpg" .

Catatan: Gambar eksternal mungkin berada di bawah hak cipta. Jika Anda tidak mendapatkan izin untuk menggunakannya, Anda mungkin melanggar hak cipta. Selain itu, Anda tidak dapat mengontrol gambar eksternal; itu bisa tiba tiba dihapus atau diubah.

2. URL Relatif : Tautan ke gambar yang dihost di dalam situs web. Di sini, URL tidak menyertakan nama domain. Jika URL dimulai tanpa garis miring, itu akan relatif terhadap halaman saat ini. Contoh: src="img_girl.jpg". Jika URL dimulai dengan garis miring, itu akan menjadi relatif terhadap domain. Contoh: src="/images/img_girl.jpg".

Tip: Hampir selalu yang terbaik adalah menggunakan URL relatif. Mereka tidak akan rusak jika Anda mengubah domain.

Atribut lebar dan tinggi

Tag <img> juga harus berisi atribut width dan height, yang menentukan lebar dan tinggi gambar (dalam piksel):

<img src="img_girl.jpg" width="500" height="600">
Try it

Atribut alt

alt Atribut yang diperlukan untuk <img> tag menentukan teks alternatif untuk gambar, jika gambar karena alasan tertentu tidak dapat ditampilkan. Hal ini dapat disebabkan oleh koneksi yang lambat, atau kesalahan pada src atribut, atau jika pengguna menggunakan pembaca layar.

<img src="img_girl.jpg" alt="Girl with a jacket">
Try it

Atribut style

Atribut style digunakan untuk menambahkan gaya ke elemen, seperti warna, font, ukuran, dan lainnya.

<p style="color:red;">This is a red paragraph.</p>
Try it

Atribut lang

Anda harus selalu menyertakan lang atribut di dalam <html> tag, untuk mendeklarasikan bahasa halaman Web. Ini dimaksudkan untuk membantu mesin pencari dan browser.

Contoh berikut menentukan bahasa Inggris sebagai bahasa:

<!DOCTYPE html>
<html lang="en">
<body>
...
</body>
</html>

Kode negara juga dapat ditambahkan ke kode bahasa di lang atribut. Jadi, dua karakter pertama menentukan bahasa halaman HTML, dan dua karakter terakhir menentukan negara.

Contoh berikut menentukan bahasa Inggris sebagai bahasa dan Amerika Serikat sebagai negara:

<!DOCTYPE html>
<html lang="en-US">
<body>
...
</body>
</html>

Atribut title

Atribut title mendefinisikan beberapa informasi tambahan tentang suatu elemen.

Nilai atribut title akan ditampilkan sebagai tooltip saat Anda mengarahkan mouse ke elemen:

<p title="I'm a tooltip">This is a paragraph.</p>
Try it