Estimasi Waktu Baca: 3 menit

Deskripsi Tag

Tag <a> berfungsi untuk mendefinisikan hyperlink yang digunakan untuk menghubungkan dari satu halaman ke halaman yang lain.

Huruf a dalam elemen <a> menunjukkan anchor. Anchor merupakan teks yang menunjukkan awal dan akhir suatu hypertext link.

Elemen <a> memiliki satu atribut penting yang umum digunakan yaitu href, yang berfungsi untuk menentukan tujuan dari tautan. Jika elemen <a> diberi atribut href di dalamnya maka elemen tersebut akan menunjukkan sebuah hyperlink (hypertext anchor). Sedangkan jika tidak maka hanya akan menunjukkan placeholder.

Secara default, standar untuk style atau gaya dari hyperlink text pada semua browser adalah sebagai berikut

  • Jika link belum pernah dikunjungi warnanya adalah biru dan bergaris bawah
  • Jika link sudah pernah dikunjungi warnanya adalah ungu dan bergaris bawah
  • Jika link aktif (saat diklik) warnanya adalah merah dan bergaris bawah

Sintaks Elemen

Berikut sintaks dari elemen <a>:


<a href="URL">Teks link</a>

Pada umumnya pendefinisian elemen <a> sering diikuti dengan atribut href.

Atribut

Pada tabel di bawah ini berisi beragam atribut yang sering digunakan bersamaan dengan tag <a>.

AtributNilaiDeskripsi
downloadnama fileMenentukan bahwa target akan didownload ketika pengguna mengklik hyperlink
hrefURLMenentukan URL halaman yang dituju link
hreflangkode bahasaMenentukan bahasa dari link yang akan dituju
mediamedia queryMenentukan perangkat atau media apa link yang dituju akan dioptimalkan
pingdaftar URLMenentukan URL untuk diinformasikan bahwa pengguna mengikuti hyperlink
referrerpolicyno-referrer
no-referrer-when-downgrade
origin
origin-when-cross-origin
unsafe-url
Menentukan perujuk mana yang akan dikirim
relalternate
author
bookmark
external
help
license
next
nofollow
noreferrer
noopener
prev
search
tag
Menentukan hubungan antara dokumen saat ini dan dokumen tertaut
target_blank
_parent
_self
_top
nama frame
Menentukan tempat untuk membuka dokumen tertaut
typetipe mediaMenentukan jenis media dari dokumen yang tertaut

Atribut Global

Atribut global adalah atribut yang berlaku untuk semua tag di HTML.

Kunjungi link berikut untuk melihat daftar Atribut Global

Atribut Event

Atribut event adalah atribut yang akan dijalankan ketika terdapat suatu peristiwa atau interaksi dari user.

Dukungan Browser

Untuk mengetahui dukungan setiap browser dapat dilihat pada tabel berikut:

Elemen
<a>YaYaYaYaYa

Lebih Banyak Contoh

Cara menautkan ke gambar


<a href="https://kopiding.in">
   <img src="image.png" alt="image-info" width="150" height="150"/>
</a>

Cara membuka tautan pada jendela browser baru


<a href="https://kopiding.in" target="_blank">Kunjungi Kopiding.in</a>

Cara menautkan ke alamat email


<a href="mailto:[email protected]">Kirim Email</a>

Cara menautkan ke nomor telepon


<a href="tel:+6281234567890">+62-8123-4567-890</a>

Cara menautkan ke bagian lain di halaman yang sama


<a href="#sub-judul">Mengenal HTML</a>

Cara menautkan ke Javascript


<a href="javascript:alert('Halo Dunia')">Klik di sini</a>

Pengaturan CSS Default

Pada umumnya browser akan menampilkan elemen <a> dengan nilai default sebagai berikut:


a:link, a:visited {
  color: (internal value);
  text-decoration: underline;
  cursor: auto;
}

a:link:active, a:visited:active {
  color: (internal value);
}