Cara Membuat link di HTML – Tag a

Belajar HTML Dasar - Membuat Link dengan Tag

Yang sering kita lihat dalam sebuah website adalah link. Link ini akan membuat konten atau elemen HTML dapat di klik dan akan mengarahkan anda ke halaman web lainnya. Umumnya suatu link ditampilkan berwarna biru dan bergaris bawah (selama belum diberi style).

Membuat link di HTML

Link berfungsi untuk menghubungkan halaman-halaman web, situs yang lain atau bagian-bagian tertentu pada suatu halaman web. Tag <a>…</a> digunakan untuk membentuk suatu link ke dokumen atau sumber yang akan dimuat ketika user melakukan klik pada link tersebut.

Cara Membuat link dengan tag <a>

Link ditulis dengan tag <a> yang merupakan singkatan cari anchor (jangkar). Setiap tag <a> memiliki sebuah atribut href. Dimana href berisi alamat yang dituju (href adalah singkatan dari hypertext reference). Penulisannya dapat dilihat seperti berikut :

Contoh link html

<html>
<body>
<p>
<a href="matakuliah.html">Mata kuliah</a>
Digunakan untuk menghubungkan dengan halaman matakuliah pada suatu
web site.
</p>
<p>
<a href="http://www.microsoft.com/">Link Ke Microsoft</a>
Link yang menghubungkan dengan suatu halaman di World Wide Web.
</p>
</body>
</html>

Alamat Link ini juga terbagi dua yaitu Alamat Absolute dan Alamat Relatif

Alamat Absolute

Alamat absolute itu adalah penulisan alamat file dengan menyertakan nama website, seperti:
href=”http://www.microsoft.com/” ataupun href=”http://www.wikipedia.org”.
Alamat absolute sering disebut external link yaitu link yang mengarah ke website lain. Penulisan alamat absolute juga harus di lengkapi dengan “http://www.”

Alamat relatif

Alamat relatif maksudnya adalah alamat yang dipanggil relatif dengan tempat kita memanggil link tersebut.
Contoh ada dua file didalam satu folder, link1.hml dan link2.html
Saya ingin memanggil link2.html didalam link1.html
Untuk memanggilnya cukup tulis a href=”link2.html” tanpa harus menulis http://www.
Inilah yang disebut link relatif.
Namun jika file yang akan kita panggil berada dalam folder lain kita bisa memanggal dengan menulis nama folder terlebih dahulu seperti ini href=”namafolder/link2.html”.
Namun lain lagi jika file tersebut berada didalam folder yang bertingkat, misalnya dalam folder A kedian di folder A ada lagi folder B, file yang akan kita panggil berada di folder b ini, kita dapat memanggilnya seperti ini href=”../../link2.html”

Target Link

Link yang kita buat secara default ketika diklik akan langsung terbuka link yang diklik, menutup halaman yang lagi kita buka berpindah ke halaman link yang diklik tadi.
Namun kita sebenarnya bisa membuat link yang diklik bisa terbuka di tab baru caranya dengan menambah target link.

Contoh target link

<!DOCTYPE html>
<html>
<head>
<title>Tag Link </title>
</head>
<body>
<h1>Target Link</h1>
<p>Website belajar web programming <a href="https://phpdanmysql.com"
target="_blank">Phpdanmysql.com</a></p>
</body>
</html>

Ketika link diatas diklik akan terbuka di tab baru

Link dengan Gambar

Selain menggunakan teks, link juga dapat dibuat dengan menggunakan image/gambar. Caranya adalah dengan mengkombinasikan antara tag <A> dan tag <IMG>. Berikut ini adalah contoh dokumen HTML yang menggunakan image sebagai link :

<html>
<body>
<p>
Image juga dapat dijadikan Link <a href="https://phpdanmysql.com/" target="_blank">
<img src="https://phpdanmysql.com/wp-content/uploads/2018/06/logo.png" width="65" height="38" border="2"> </a>
</p>
</body>
</html>

Dari cara diatas saya yakin anda sudah bisa membuat link, bukan hanya link di text tapi link di gambar juga sudah bisa bahkan link bisa terbuka di tab baru.
semoga tutorial html dasar cara membuat link di html ini dapat bermanfaat, Selanjutnya kita akan belajar html dasar tentang Menambah gambar di html
ke Bab sebelumnya Lanjut ke Bab selanjutnya  

Keyword:

  • teks yang bergaris bawah dan berfungsi menghubungkan ke informasi atau website disebut
  • cara membuat html dan php

Get real time updates directly on you device, subscribe now.

Ingin Berkomentar?

×
Lewat ke baris perkakas