Software Developer
www.metinpolat.net

Html İle Sayfaya Resim Ekleme

0 19

Html İle Sayfaya Resim Ekleme

HTML: <img> etiketi

<img> etiketi, HTML belgesindeki bir görüntüyü tanımlar. Bu etikete yaygın olarak <img> öğesi de denir.

Kısacası <img>  etiketi web sayfasına bir görsel eklemek için kullanılır.

Web sayfanıza bir görüntü yerleştirmek için, web dizini yapınızın içinde bir grafik dosyasına ihtiyacınız olacaktır.

Web sitenizi düzenli tutmak için tüm resimlerinizi bir klasöre yerleştirmek çok iyi bir uygulamadır.(Örneğin resimler klasörü veya img,images gibi)

Web tarayıcıları yalnızca birkaç tür grafik dosyasını görüntüleyebilir. Bunlar: PNG, JPEG ve GIF. Başka bir grafiğiniz varsa biçimlendirmek için yukarıda listelenen uyumlu biçimlerden birine dönüştürülmesi gerekecektir.

Bu etiket, web sayfanız içinde bir grafik görüntü gösterir. Resim etiketi bir bitiş etiketi gerektirmez.

Özellikler

Özellik Değeri Açıklama
alt metin Görsel için alternatif bir metin oluşturur.
crossorigin anonymous
use-credentials
Görselin başka bir web sayfasından erişim izini.
height pixels Görseli belirli bir yükseklik boyutuna ayarlar.
width pixels Görseli belirli bir genişlik boyutuna ayarlar.
ismap ismap Bir görüntüyü sunucu tarafında image-map (görüntü haritası) olarak belirtir.
longdesc URL Görselin ayrıntılı açıklamasında URL belirtir.
sizes Farklı sayfa düzenleri için görsel boyutlarını belirtir.
src URL Görselin URL adresini belirtir.
srcset URL Farklı durumlarda kullanılacak görselin adresini belirtir.
usemap #mapname Görseli kullanıcı tarafında image-map (görüntü haritası) olarak belirtir.

 

Varsayılan Css Değerleri

<img> Etiketi Kullanımı:

HTML’de etiketinin yazımı :

veya XHTML’de etiketinin sözdizimi şöyledir:

Dikkat ettiyseniz eğer html’de <img> etiketi sonda kapatılmadı ama xhtml’de sonda kapattıldı.

Tarayıcı Uyumluluğu

<img> etiketi aşağıdaki tarayıcılarda temel desteğe sahiptir:

  • Chrome
  • Android
  • Firefox (Gecko)
  • Firefox Mobile (Gecko)
  • Internet Explorer (IE)
  • Edge Mobile
  • Opera
  • Opera Mobile
  • Safari (WebKit)
  • Safari Mobile

Abone Ol
En son haberleri, gelişmeleri ve blog yazılarımı doğrudan gelen kutunuza almak için buradan abone olabilirsiniz.
İstediğiniz zaman abonelikten çıkabilirsiniz

Yorum Yazın

E-posta hesabınız yayımlanmayacak.