HTML Link

# Link HTML – Hyperlink
Link HTML adalah hyperlink.
Sebuah hyperlink adalah elemen, teks, atau gambar yang Anda dapat mengklik, dan melompat ke dokumen lain baik di halaman itu sendiri atau membuka halaman baru.
Example :
<a href=“http://www.rubinludi.com”>A step further by learning system</a>
<a href=“html_images.jpg”>HTML Images</a>

# Link HTML – Warna dan Ikon saat memilih link
Ketika Anda memindahkan kursor mouse di atas link page, dua hal yang biasanya akan terjadi:
Mouse panah akan berubah menjadi tangan kecil warna putih
Warna elemen link akan berubah dengan sendirinya
Secara default, link akan muncul karena hal ini di semua jenis browser :
Link yang belum dikunjungi adalah di garis bawahi dan biru
Sebuah link yang dikunjungi adalah di garis bawahi dan ungu
Link aktif adalah di garis bawahi dan merah
Anda dapat mengubah warna default, menggunakan gaya seperti di bawah ini :
<style>
a:link {color:#000000; background-color:transparent}
a:visited {color:#000000; background-color:transparent}
a:hover {color:#ff0000; background-color:transparent}
a:active {color:#ff0000; background-color:transparent}
</style>

# Link HTML – Target Atribut
Target atribut menentukan di mana untuk membuka dokumen terkait.
Contoh ini akan membuka dokumen terkait dalam jendela browser baru atau tab baru:

Target Value Description
_blank Membuka link dengan jendela browser / tab yang baru.
_self Membuka dokumen terkait dalam frame yang sama seperti yang diklik (ini adalah standard link).
_parent Membuka dokumen terkait dalam kerangka induk, Halaman itu sendiri.
_top Membuka dokumen terkait dalam halaman penuh dalam browser.
framename Membuka dokumen terkait dalam bingkai bernama (ini jarang di lakukan).

Jika halaman web Anda terkunci dalam bingkai frame, Anda dapat menggunakan target = “_ top” untuk keluar dari frame:
contoh:

<a href=“http://www.rubinludi.com” target=“_top”>A step further by learning system</a>
 # HTML Links – Image as Link
<a href=“default.html”>
<img src=“smiley.gif” alt=“HTML tutorial” style=“width:42px;height:42px;border:0”>
</a>

Leave a Reply

Your email address will not be published. Required fields are marked *