HTML Link Verme

  • 01-07-2020 03:34
  • 5810

HTML dökümanında bir başka sayfaya bağlantı (link) vermek için <a> tagı kullanılır. Aynı sayfaya bağlantı verebileceğiniz gibi bir başka sayfaya da bağlantı verebilirsiniz. Farklı bir sayfaya bağlantı vermek için 'a' tagının href özelliğine bağlantı verilecek sayfanın URL'si yazılır. Taglar arasına ise sayfada görünecek text yazılır.

Örnek HTML bağlantı kodu.


<!DOCTYPE html>
<html> <body> <a href="https://notpast.com">Notpast</a> </body> </html>

 

Eğer kendi alan adınız altında bir başka sayfaya bağlantı verecekseniz, URL kısmına sadece sayfanın adını yazmanız yeterli 'http://' yazmanıza gerek yok. Bağlantı sayfalara verilebileceği gibi dosyalara da verilebilir. Eğer link verilen dosya tarayıcı tarafından açılabilir bir dosya ise dosya tarayıcıda açılır. Tarayıcının açamadığı dosyalar tarayıcı tarafından download edilir.

Çeşitli dosyalara HTML bağlantı verme örneği.

<a href="logo.png">Logo</a> <br>
<a href="dokuman.pdf">Kullanım Klavuzu</a> <br>
<a href="programlama.html">Programlama</a>

 

İçeriğe Bağlantı Verme

Aynı sayfa içinde içeriğe bağlantı verebiliriz. Bunun için bağlantı vereceğimiz içeriğin bulunduğu elemte id özelliğine bir değer vermeliyiz daha sonra bu değeri  a tagında href="#id" şeklinde yazmalıyız. Linke tılandığında bağlantı verdiğimiz içerik sayfanın en üstüne gelecek şekilde sayfa kayar. Bu yöntem sayfanın başına gelmek için sıklıkla kullanılır.

Sayfa içi içeriğe bağlantı verme örnek HTML kodu

<h1 id="start">Sayfa Başlığı</h1>
<div style="height: 2000px; width: 100%;"></div>
<a href="#start">Sayfa başına git</a>

Bağlantıyı Yeni Sekmede Açma

Bağlantıyı farklı sekmede açmak için target özelliği kullanılır. Bu özelliğe _blank değeri verilerek bağlantı yeni sekmede açılır. Bu özellik hem dış hem de iç sayfalar için kullanılabilir.

HTML bağlantısını ayrı sekmede açan örnek kod.


<a
target="_blank" href="https://notpast.com">Notpast</a>

Bağlantıyı Javascript'te Yönlendirme

Bağlantıyı Javascrip'te yönlandirmek için href özelliği javascript:fonksiyon şeklinde kullanılır. fonksiyon javascrip'te tanımlanmış bir fonksiyon olmalı. Aşağıdaki örnek kodda showclick fonksiyonu ile linke kaç kez tıklandığı sayılıyor ve fonksiyon çağrıldığında ekranda tıklama sayısı yazılıyor.


<!DOCTYPE html>
<html> <body> <div id="c-text"></div> <a href="javascript:showclick()">Tıklanma Sayısı</a> </body> <script type="text/javascript"> var sayac=0; function showclick(){ sayac++; var el=document.getElementById("c-text"); el.innerHTML="Linke "+sayac+" kez tıklandı." } </script> </html>

Maile Bağlantı Verme

Maile bağlantı vermek için href özelliğine mailto:mail-adresi şeklinde mail adresi yazılarak kullanılır. Bu şekilde bağlantıya tıklandığında mail göndermek için mail programı tarayıcı tarafından açılır ve gönderilecek mail adresi kısmına burada kullandığımız mail yazılır.

Örnek HTML kodu.


<a
href="mailto:info@notpast.com">Mail Gönder</a>