HTML Resime Link Verme


Html-Php ve Diğer Kodlama Dilleri   

Yazar: mens    0 Yorum    161 Görüntüleme
  • 0 Oy - 0 Yüzde

Paylaşım Tarihi: 23.06.2016, 00:02:44 #1
mens ☆☆ PEACE ☆☆
Onaylı Uye
Status: Çevrimdışı Yorum Sayısı:181 Konu Sayısı:26 Üyelik Tarihi:09.04.2016 Rep Puanı: 66

HTML'de resime link verme çok kolay iştir. Bu kod genellikle nerede kullanılır. veren kişilerin kendi sitelerine yönlendirilmesi için bu kod kullanılır.

Kod:
<a href="http://www.google.com">GOOG'LE GİDER</a>

Yukarıda yazıya link verme örneği var. Resime'de link vermek için GOOG'LE GİDER yazısının yerine resim ekleme etiketi img eklememiz yeterlidir.
ÖRNEK :
Kod:
<a href="http://www.google.com">

<img src="images/resim.jpg"></a>


href : resmimize link vereceğimiz web adresi.
img : resim çağırmamızı sağlayan kod.
src : resmimizin bulunduğu klasör/dosya adresini gösterir.
Resimler Ana dizindeyse direk src="resim.jpg" farklı klasördeyse, örneğin images dizinin altındaysa src="images/resim.jpg" şeklinde belirtiriz.
Not: Web sayfasında resimlerinize link vereceğiniz için resimlerin aynı klasör/dosya içinde olduğunu kontrol edin.


ÇIKTI : 1. Örnek Resmi Görmek İçin  linkleri görmek için giriş yapmanız. Yada üye olmanız gerekir.


Gördüğünüz üzere kodumuz çalışmakta. Yalnız bu şekilde yazdığımızda resim dosyamızın çevresinde kenar çizgisi (border) oluşur, bunu önlemek için img etiketimize border="0" kodunu ekliyoruz ve kodumuzu:


Kod:
<a href="http://www.google.com">

<img src="images/resim.jpg" border="0"></a>

Haline getiriyoruz.

ÇIKTI : 2. Örnek Resmi Görmek İçin  linkleri görmek için giriş yapmanız. Yada üye olmanız gerekir.  

Resim üzerine geldiğimizde bilgi baloncuğu çıkmasını istiyorsak img Etiketimize title="Görünecek yazı" ekliyoruz.


Kod:
<a href="http://www.google.com">

<img title="goog'le gider" src="images/resim.jpg" border="0">

</a>

ÇIKTI : 3. Örnek Resmi Görmek İçin linkleri görmek için giriş yapmanız. Yada üye olmanız gerekir.

Kullanıcılara resim önizleme vermek için:

Kod:
<a href="images/resim.jpg">

<img src="images/resim.jpg" border="0"></a>

[b]Lütfen resim önizleme için aşağıdaki resme tıklayınız.[/b]

 4. Örnek Resmi Görmek İçin linkleri görmek için giriş yapmanız. Yada üye olmanız gerekir.


Emeğe Saygı İçin REP Vermeyi Esirgemeyin


 
 

Kullanıcı İmzası
İmage

rE9nlM.png

           Günün Sözü :  Geciken adalet,adaletsizliktir.  Walter Savago Landor







Aradığınızı Bulamadınız Mı ?

Konuyu görüntüleyenler:
1 Misafir