Gambar

Gambar akan membuat website kita terlihat lebih menarik.

Menambahkan Gambar di HTML

Untuk menambahkan gambar kita dapat mengunakan Tag <img> yang memiliki atribut wajib, yakni src sebagai lokasi gambar .

Alamat URL gambar pada atribut src dapat berupa URL maupun alamat path.

Atribut pada <img>

  • src = Menentukan Lokasi gambar
  • alt = Menentukan teks alternatif untuk gambar
<img src="img_buku.jpg" alt="Buku">
Try it

Catatan : Pastikan lokasi gambar img_buku.jpg berada dalam folder yang sama pada dokument HTML

Format File Gambar

Berikut adalah jenis file gambar yang paling umum, yang didukung di semua browser (Chrome, Edge, Firefox, Safari, Opera):

Nama FormatNama PanjangEkstensi
APNGAnimated Portable Network Graphics.apng
GIFGraphics Interchange Format.gif
ICOMicrosoft Icon.ico, .cur
JPEGJoint Photographic Expert Group image.jpg, .jpeg, .jfif, .pjpeg, .pjp
PNGPortable Network Graphics.png
SVGScalable Vector Graphics.svg
WebPWeb Picture.webp

Ringkasan Bab

  • Gunakan elemen<img>untuk mendefinisikan gambar
  • Gunakan atribut src untuk menentukan Lokasi gambar
  • Gunakan atribut alt untuk menentukan teks alternatif untuk gambar, jika gambar tidak dapat ditampilkan
  • Gunakan atribut width dan height untuk menentukan ukuran gambar