Link pada HTML merupakan tujuan dari kata Hypertext dari HTML. Dalam tutorial HTML kali ini kita akan membahas cara membuat link di HTML. Tujuan kata Hypertext dari HTML adalah membuat sebuah text jika di-klik akan pindah ke halaman lainnya. HTML menggunakan tag link untuk keperluan ini.
Tag link ditulis dengan <a>, singkatan dari anchor (jangkar)
Setiap tag link setidaknya memiliki sebuah atribut href. Dimana href akan berisi alamat yang dituju. (href adalah singkatan dari hypertext reference). Silahkan buka text editor dan buat kode seperti dibawah ini.
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Tag Link</title>
</head>
<body>
<h1>Belajar Tag Link</h1>
<p>Saya sedang belajar HTML dari
<a href="http://www.codingwebgratis.com">CodingWebsite Gratis</a></p>
</body>
</html>
Contoh diatas menggunakan alamat absolut, artinya kita menuliskan alamat link dengan lengkap. Alamat absolute ditulis dengan lengkap, seperti http://www.codingwebgratis.com, atau jika kita merujuk kepada halaman tertentu, menjadi http://www.codingwebgratis.com/nama_halaman.html.
Baca Juga
- Bagian 15. Memulai Menggunakan CSS
- Tutorial Video The Complete Angular Course Beginner to Advanced Free Download
- Kumpulan Video dan Source Tutorial Master PHP Pemula Full Complit Gratis
- Kumpulan Tutorial Developers 2018 Full Gratis Download
- Menggunakan Library dan Helper di CodeIgniter
- CodeIgniter & Database
- Bagian 19. Membuat Halaman Website Minimalis
- Bagian 18. Lebih Dalam Bekerja dengan CSS
- Bagian 17. Struktur Penulisan Pada CSS
- Bagian 16. Cara Menggunakan CSS
Namun jika halaman web yang kita tuju adalah di dalam folder tempat kita menjalankan file ini, tidak perlu menuliskan alamat lengkap dari link tersebut, atau disebut juga alamat relatif. Alamat relatif maksudnya adalah relatif kepada file tempat kita memanggil link ini. Seandainya nama filenya adalah belajar_link.html berada dalam folder yang sama dengan halaman belajar_list.html, maka kita dapat menggunakan href="belajar_list.html" untuk menghubungkan antara belajar_link.html dengan belajar_list.html.
Sebagai contohnya untuk alamat relatif, Seandainya kita ingin membuat link kepada file hello.html yang berada di dalam folder yang sama, kode HTMLnya akan menjadi :
Contoh penggunaan tag link <a>:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Tag Link </title>
</head>
<body>
<h1>Belajar Tag Link</h1>
<p>Halaman HTML pertama saya adalah <a
href="hello.html">Klik Hello</a></p>
</body>
</html>
Jika file tersebut berada di dalam folder lagi_belajar, maka alamat relatifnya menjadi href="lagi_belajar/belajarhtml.html". Namun bagaimana jika halaman tersebut berada 2 tingkat di luar folder saat ini?
Kita dapat menggunakan href="../../belajarhtml.html", untuk naik 2 folder diatasnya. Satu tingkat cukup menggunakan href="../belajarhtml.html", 2 tingkat menggunakan href="../../belajarhtml.html", tiga tingkat href="../../../belajarhtml.html", dan seterusnya dan seterusnya.
Atribut penting dari lainnya tag link adalah target. Secara default, setiap link yang kita tulis akan terbuka pada halaman itu juga, jika ingin halaman tersebut terbuka pada tab lain, gunakan atribut target="_blank".
Contoh penggunaan tag link <a> dengan atribut target:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Tag Link </title>
</head>
<body>
<h1>Belajar Tag Link</h1>
<p>Saya sedang belajar html dari <a href="http://www.codingwebgratis.com"
target="_blank">Coding Website Gratis</a> dan akan terbuka pada tab baru</p>
</body>
</html>
Priview
Belajar Tag Link
Saya sedang belajar html dari Coding Website Gratis dan akan terbuka pada tab baru
Bagian 10. Membuat Link Menghubungkan Halaman HTML
Reviewed by Akief Takaful
on
10:43 PM
Rating:
Reviewed by Akief Takaful
on
10:43 PM
Rating:
No comments: