Hello World
Uzman Üye
HTML'de resime link verme çok kolay iştir. Bu kod genellikle nerede kullanılır. Reklam veren kişilerin kendi sitelerine yönlendirilmesi için bu kod kullanılır.
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 :
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
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:
Haline getiriyoruz.
ÇIKTI : 2. Örnek Resmi Görmek İçin
Resim üzerine geldiğimizde bilgi baloncuğu çıkmasını istiyorsak img Etiketimize title="Görünecek yazı" ekliyoruz.
ÇIKTI : 3. Örnek Resmi Görmek İçin
Kullanıcılara resim önizleme vermek için:
Lütfen resim önizleme için aşağıdaki resme tıklayınız.
4. Örnek Resmi Görmek İçin
Emeğe Saygı İçin REP Vermeyi Esirgemeyin
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
Bağlantıları görmek için lütfen
Giriş Yap
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
Bağlantıları görmek için lütfen
Giriş Yap
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
Bağlantıları görmek için lütfen
Giriş Yap
Kullanıcılara resim önizleme vermek için:
Kod:
<a href="images/resim.jpg">
<img src="images/resim.jpg" border="0"></a>Lütfen resim önizleme için aşağıdaki resme tıklayınız.
4. Örnek Resmi Görmek İçin
Bağlantıları görmek için lütfen
Giriş Yap
Emeğe Saygı İçin REP Vermeyi Esirgemeyin