Sen burayı gördün, başkası da görecek. Teklifini gönder, sitenin kahramanı ol.

Sponsor'un katkılarıyla...

<img> Etiketi

<img> Etiketi

<img> etiketi resim ve fotoğraf gibi görsel ögelerin sayfada gösterilmesini sağlar.

/ 19.05.1919?

Yazar:
SonDevrimBu Yazı
Toplam285071392
Bugün965

<img> Etiketi Temel Özellikler

Etiket Yazımı ve Etiket Kullanımı :
<img> <!-- Etiket yalnızca açılmalı. -->
Örnek :
DOM Arayüzü :
HTMLImageElement
Durum :
Yaşayan Ölçün
Öznitelikler :
Tüm Evrensel Öznitelikler
Açıklama :

<img> Etiketi Kullanımı

Sponsor'un katkılarıyla...

Markanız için 300X300 alan.

Reklamı kapat görseli

<img> etiketi resim ve fotoğraf gibi görsel ögelerin sayfada gösterilmesini sağlar.

<img> etiketinde src ve alt özniteliklerinin kullanımı zorunludur.

src: Kaynak dosyanın yolunu belirtir.

alt: Dosya bulunamazsa, dosyanın yerine gösterilecek olan yazıyı belirtir.

alt özniteliği kesinlikle kullanılmalı. Görselin gösteril(e)mediği durumlarda alt gösterilecek. Sayfayı telefondaki birine düz metin okur gibi okurken orada sanki görsel yokmuş da yerine düz metin varmış gibi düşündüğünüzde ne söylemeniz uygun ise onu yazın.

title özniteliği, fare ile görselin üzerine gidildiğinde bilgi olarak gosterilir.

<img> etiketinde title özniteliğinin kullanımı zorunlu olmasa da arama motorları gereksinim duyuyorlar.

<img> etiketi <a> etiketinin içine yerleştirilirse, görsele tıklandığında bağlantı açılır.

<img src="https://SonDevrim.com/örnek.jpg" alt="SonDevrim Logo" title="SonDevrim Logosu !">

<img> Etiketi Tarayıcı Desteği

MasaüstüTaşınabilir
Tarayıcı →Öznitelik ↓
Temel DestekVarVarVarVarVar
srcset32.0 (32.0) [2]217.134.0Yok
referrerpolicy42.0 (42.0) [3]??46.0 [1]?
Tarayıcı →Öznitelik ↓
Temel DestekVarVarVarVarVar
srcsetYok21iOS 8?Yok
referrerpolicy42.0 (42.0) [3]??46.0 [1]?

[1] : Tarayıcıdaki kullanıcı ayarlarına bağlı.

[2] : about:config adresindeki ayara bağlı.

[3] : Bu öznitelik Firefox 42'den 44'e kadar referrer olarak adlandırıldı ve about:config adresindeki network.http.enablePerElementReferrer ayarına bağlıydı. Firefox 45 ile referrerpolicy olarak adlandırıldı.

Kaynak: Mozilla Geliştirici Ağı - MDN 10 Yaşında - CC-BY-SA 2.5

Öznitelikler

alt
Görselin gösterilemediği durumlarda, onun yerine gösterilecek olan yazı.
Görsel indirilene kadar gösterilir.
Hiç kullanılmaması, etiketin, sayfanın "temel ögesi" olduğu anlamına gelir.
Değer tutmadan kullanılması, alt="" gibi, etiketin "temel öge" olmadığı anlamına gelir ve görsel göstermeyen bazı tarayıcılarda sayfa gösterimde hesaba katılmamasına neden olabilir.
crossorigin
Kökenler arası paylaşımı etkinleştirir.

Hatalı kullanılması ya da kullanılmaması durumunda aşağıdakiler geçerlidir:

  • Boş ("") ya da yanlış (yani belirtilenlerin dışında) bir değer ile kullanılması <img> etiketinin CORS durumunu Anonymous yapar.
  • Özniteliğin yokluğu, yani kullanılmaması, <img> etiketinin CORS durumunu NO CORS yapar.

Etiketlerin CORS durumunu Anonymous yapmak için anonymous sözcüğü kullanılır!

anonymous
İstekte bulunan etiketin modunu cors ve kimlik modunu same-origin yapar.
Etikette Anonymous durumunu etkinleştirir. İstek, sunucuya gönderilirken kimlik değeri gönderilmez (anonymous) ve eğer sunucu kimlik değerleriyle yanıt döndürmezse, kullanım yasaklanır.
use-credentials
İstekte bulunan etiketin modunu cors ve kimlik modunu include yapar.
Etikette Use Credentials durumunu etkinleştirir. İstek, sunucuya gönderilirken kimlik değeri ile gönderilir (use-credentials) ve eğer sunucu kimlik değerleriyle yanıt döndürmezse, kullanım yasaklanır.
height
Görsel yüksekliğini belirtir.
ismap
Görselin sunucu taraflı image-map olduğunu belirtir.
src
Görselin kaynağını belirtir.
srcset
Yüksek çözünürlük ya da küçük ekranlar gibi farklı durumlarda görsel seti (bir ya da daha fazla görsel URL'si) kullanabilmeye yarar. Birden fazla görsel kullanılıyorsa, görsel adaylarının (yani olası durumlarda kullanılacak olan görsellerin) URL'leri arasında ayraç olarak virgül (,) ve en azından bir boşluk ( ) kullanılmalıdır.
<img src="image.png" srcset="image-1x.png 1x, image-2x.png 2x, image-3x.png 3x">
srcset desteklemeyen tarayıcılarda src özniteliği kullanılır.
1 CSS pikseli başına 1 aygıt pikseli düşen aygıtlarda 1x, 1 CSS pikseli başına 2 aygıt pikseli düşen aygıtlarda 2x, 1 CSS pikseli başına 3 aygıt pikseli düşen aygıtlarda 3x gösterilir.
title
Fare ile görselin üzerine gidildiği durumlarda, gösterilecek olan bilgi notu.
usemap
Görselin istemci (tarayıcı) taraflı image-map olduğunu belirtir.
width
Görsel genişliğini belirtir.

İlişkili Etiketler

<a> etiketi

<img> etiketi

<picture> etiketi

Reklamı kapat görseli

Görüş Bildirin?

Toplam Oy Sayısı : Şimdilik hiç oy verilmemiş.

Ortalama Oy Değeri : Verilen oyun geçerli olması için yapılan yorumun onaylanması gerekiyor.

Görüşler yükleniyor . . .

Yorum Ekle?

1000
<img> Etiketi