Baris-baris Code. Blog Buat yang Mau Belajar Programming

Link & Gambar

Link dan gambar adalah dua elemen paling sering digunakan di web. Link menghubungkan halaman satu ke halaman lain, sedangkan gambar memperkaya tampilan konten.

Link (Tautan)

Tag <a> digunakan untuk membuat link. Atribut href menentukan tujuan link.


<a href="https://google.com">Pergi ke Google</a>

Membuka Link di Tab Baru

Tambahkan atribut target="_blank" agar link terbuka di tab baru.


<a href="https://google.com" target="_blank">Buka di tab baru</a>

Jenis-Jenis Link

  • Link eksternal — menuju website lain: href="https://..."
  • Link internal — menuju halaman lain di website yang sama: href="tentang.html"
  • Link anchor — menuju bagian tertentu di halaman: href="#section-id"
  • Link email — membuka aplikasi email: href="mailto:email@contoh.com"

<a href="tentang.html">Halaman Tentang</a>
<a href="#kontak">Lompat ke Kontak</a>
<a href="mailto:saya@email.com">Kirim Email</a>

Gambar

Tag <img> digunakan untuk menampilkan gambar. Atribut src menentukan lokasi gambar, dan alt menampilkan teks alternatif jika gambar gagal dimuat.


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

Mengatur Ukuran Gambar

Ukuran gambar bisa diatur menggunakan atribut width dan height (dalam piksel).


<img src="foto.jpg" alt="Foto profil" width="200" height="200">

Gambar sebagai Link

Kamu bisa menggabungkan <a> dan <img> untuk membuat gambar yang bisa diklik.


<a href="https://google.com">
    <img src="logo.png" alt="Logo Google">
</a>