Hyperlink
digunakan untuk menghubungkan antar dokumen di dalam web. Tag HTML Hyperlink
biasa disebut dengan anchor (a) kemudian diikuti dengan href sebagai alamat
tujuan dari link tersebut. Berikut kita akan membuat suatu Hyperlink ke suatu
alamat url:
<html>
<head></head>
<body>
<p>Aku sekarang sedang membuat hyperlink</p>
Jika anda ingin mengunjungi Microsoft
<a href="http://www.microsoft.com/">Klik
disini</a><br>
<a href="http://www.yahoo.com/">Link
ini</a> akan membawa anda
ke Yahoo.com
<p>Untuk membuat hyperlink url agar dibuka pada
jendela browser yang
baru:<p>
<a href="http://www.mp3.com/"
target="_blank">Website Musik</a>
<p>Agar hyperlink tidak bergaris bawah:<p>
<a
href="http://www.mp3.com/"target="_blank"
style="text-decoration:
none">Website Musik</a>
<p>Hyperlink ke suatu halaman tertentu dalam
web:<p>
<!--dengan catatan anda harus tau nama halaman tujuan
tersebut-->
<a href="http://htmlcssguides.com/belajar-css/">Link
ini</a>
akan membawa anda ke halaman belajar css.
</body>
</html>
Preview
Untuk membuat hyperlink dengan menggunakan gambar (image). Pastikan gambar tersebut berada pada folder yang sama dengan dokumen html anda dan harus tahu nama dan ektensinya, kemudian ganti ke atribut yang bertuliskan scr, misalkan jika nama gambar tersebut adalah yahoo.gif, maka :
Untuk membuat hyperlink dengan menggunakan gambar (image). Pastikan gambar tersebut berada pada folder yang sama dengan dokumen html anda dan harus tahu nama dan ektensinya, kemudian ganti ke atribut yang bertuliskan scr, misalkan jika nama gambar tersebut adalah yahoo.gif, maka :
<a href="http://www.yahoo.com"> <img
src="yahoo.gif" border="0" width="147"
height="31"></a>
Img merupakan atribut untuk suatu image (gambar), border adalah garis yang mengelilingi sisi image, width dan height merupakan lebar dan tinggi dari image. Kreatiflah untuk menganti nilai yang ada diantar tanda "…"sehingga anda akan lebih mengerti. Untuk memposisikan gambar, tambahkan dengan atribut align="…", left= kiri, center= tengah dan right= kanan.
<a href="http://www.yahoo.com"> <img
src="yahoo.gif" border="0" width="147"
height="31" align="left"></a>
Sekarang coba geser mouse anda ke gambar di atas, jangan
di-klik, perhatikan akan ditampilkan suata tulisan singkat mengenai gambar
tesebut, ini disebut dengan screen tips, cara membuatnya adalah menambahkan
title pada tag anchor (a) sehingga menjadi:
<a href="http://www.yahoo.com"
title="Hai... klik gambar ini maka anda akan
dibawa ke Yahoo.com"><img
src="contoh.jpg" border="0" width="147"
height="31"
align="left" alt="yahoo"></a>
Agar cepat mengakses internet kita boleh mengatur browser
untuk tidak menampilkan image (gambar). Dan semua gambar akan ditampilkan
dengan teks alternatif (alt), jika gambar tesebut tidak memiliki alternatif
teks maka hanya akan dilambangkan dengan lambang x.
<a href="http://www.yahoo.com"> <img
border="0" src="contoh.jpg" width="120"
height="30" align="left" alt="Text
Alternatif Yahoo.com"></a>
Dalam contoh ini src atau source
yaitu contoh.jpg
Untuk lebih membuktikan hyperlink
itu berhasil, kalian bisa gambar gunadarma di sebelah kanan blog ini atau di
bawah profil saya , sekian dan terimakasih
Sumber : diberikan dari dosen
Tidak ada komentar:
Posting Komentar