Resim Etiketi
Resim etiketi HTML'de bir resim veya grafik görüntülemek için kullanılan bir yapısal etikettir. Bu etiket, tarayıcılara bir resmin kaynağını bildirir ve web sayfasında resmin doğru bir şekilde görüntülenmesini sağlar. Resim etiketi, web sayfalarına görsel içerik eklemek için önemli bir araçtır.
Kullanımı
Resim etiketi, açılış etiketi <img> ve bazı öznitelikler içerir. En önemli öznitelik src özniteliğidir ve resmin kaynağını belirtir. Diğer yaygın kullanılan öznitelikler ise alt, width, ve height öznitelikleridir.
<img src="resim.jpg" alt="Örnek Resim" width="300" height="200">src özniteliği resim.jpg olarak belirtilmiş ve görüntülenecek resmin kaynağına işaret etmektedir.
alt özniteliği, resmin alternatif bir metin açıklamasını içerir. Bu metin, resim yüklenemezse veya tarayıcı resmi görüntüleyemezse görüntülenir.
width ve height öznitelikleri, resmin genişliği ve yüksekliğini piksel cinsinden belirtir. Bu öznitelikler kullanılmazsa, tarayıcı resmi orijinal boyutunda görüntüler.
Alternatif metin
alt özniteliği, resmin alternatif metin açıklamasını içerir. Bu metin, tarayıcı resmi yükleyemezse veya kullanıcı resimleri görsel olarak görüntüleme seçeneğini devre dışı bırakmışsa görüntülenir. Ayrıca, ekran okuyucu kullanan veya görme engelli kullanıcılar için önemli bir bilgidir. Alternatif metin, resmin içeriğini veya amacını açıklayan kısa bir açıklama olmalıdır.
Boyutlar
width ve height öznitelikleri, resmin genişliğini ve yüksekliğini piksel cinsinden belirtir. Bu öznitelikler kullanılmazsa, tarayıcı resmi orijinal boyutunda görüntüler. Belirli bir boyut belirtmek, sayfanın düzgün bir şekilde yüklenmesini ve yer tutucu alanların doğru bir şekilde ayarlanmasını sağlar. Eğer orijinal boyutuyla aynı görüntülemek istiyorsanız, bu öznitelikleri kullanmanıza gerek yoktur.
Diğer öznitelikler
Resim etiketi, çeşitli diğer özniteliklerle de kullanılabilir.
title özniteliği resmin üzerine gelindiğinde görüntülenen bir açıklama veya ipucu sağlar.
class veya id öznitelikleri ile resme stil ve CSS özellikleri uygulanabilir.
style özniteliği ile doğrudan stil özellikleri belirtilebilir.
<img src="resim.jpg" alt="Örnek Resim" title="Bu bir örnek resimdir" class="resim-stili">title özniteliği ile resmin üzerine gelindiğinde "Bu bir örnek resimdir" açıklaması görüntülenecektir.
class özniteliği, resme "resim-stili" adında bir CSS sınıfı atar ve bu sınıf ile resme özel bir stil uygulanabilir.
Resim etiketi, web sayfalarında görsel içerik eklemek için önemli bir araçtır. Resim etiketi sayesinde, kullanıcılar resimleri görüntüleyebilir, tarayıcılar doğru boyutta ve biçimde resimleri yükleyebilir ve metin açıklamaları sayesinde kullanıcılar alternatif içeriği alabilirler.
