HTML kullanarak bir web sayfası oluştururken, resim etiketi sayfadaki belirli bir yere fotoğraf veya grafik eklemek için kullanılır. Gezinme aracı olarak kullanılmaya ilgi göstermekten veya bilgi vermekten web sayfalarında görüntülerin kullanılmasının birçok yolu vardır. Kullanılabilecek farklı görüntü formatları da vardır. Web sayfasına nasıl veya hangi görüntünün eklendiğinin önemi yok, her zaman resim etiketi gerekir.
Bir resim eklemek için, resmin etiketi sayfanızda görünmesini istediğiniz yerde resim etiketi bulunur. Örneğin, bu paragraftan sonra bir resim eklenecekse, bu paragraftan sonra HTML belgesine resim etiketi veya <img> eklenir. <img> etiketi, HTML'deki tüm görüntüleri tanımlar. Nitelikler içerdiğinden ve kapanış etiketi bulunmadığından boş bir etiket olarak adlandırılır. Öznitelikler, belirli bir HTML etiketi için kullanılabilen seçeneklerdir.
Bir HTML belgesine yalnızca <img> eklenirse, etiketin özellikleri eklenmemiş olduğundan hiçbir şey gösterilmez. <img> için en önemli özellik kaynak anlamına gelen "src" dır. Src niteliği, görüntü dosyasının gerçekte bulunduğu yeri belirtir veya görüntü dosyasının adresidir. Resim bir web sayfasında kullanıldığından, resmin konumu URL olarak verilecektir. HTML belgesinde, resim şöyle görünür: <img src = "URL" />.
Özellikle, URL görüntünün nerede saklandığını gösterir. Örneğin, computer.jpg dosya adındaki bir bilgisayarın görüntüsü, www.wisegeek.com adresindeki görüntüler klasöründe saklanırsa, URL ile değiştirilir: <img src = "www.wisegeek.com/images/computer. jpg "/>. Tarayıcı web sayfasını açtığında, resim etiketinin bulunduğu resmi görüntüler.
Resim etiketinde bir dizi başka farklı nitelik var. Bir kullanıcının görüntünün sayfada nasıl görüneceğini ayarlamasına izin verir. Aşağıdaki etiketler bu etiket için yaygın olarak kullanılır: alt, border, size ve align.
Alt özniteliği alternatif metin anlamına gelir ve bir tarayıcının görüntü görüntüleyememesi durumunda gösterilir. Ayrıca, görsel olarak zorlanan kullanıcılar için alternatif metinler okunur ve görüntüler üzerinde metin görüntülemeyi seçerler. Yukarıdaki örnekte, alternatif metin alt = "bilgisayarın görüntüsü" olarak belirtilebilir.
Border niteliği, belirtilen piksel sayısına bağlı olarak resme kalınlık ekler. Bu, özellikle görüntü arka planı ve web sitesi arka planı birbirine benzer olduğunda ve net bir ayrım istendiğinde yararlı olabilir. Örneğin, border = "10", görüntünün etrafına 10 piksel kalınlığında bir kenarlık yerleştirir.
Boyut öznitelikleri de önemlidir; çünkü görüntünün tam boyutunu belirlemek için genişlik ve yükseklik kullanılabilir. Bu özelliklerin çok dikkatlice kullanılması gerekir, çünkü bunları değiştirmek görüntülenen görüntünün oranlarını veya kalitesini etkileyebilir. Boyut nitelikleri, gerçek dosyayı değiştirmez, sadece tarayıcının görüntüleyiş şeklini değiştirir.
Align niteliği, görüntünün sayfadaki metne göre nasıl hizalanacağını belirtir. Bu özellik için üst, alt, orta, sola, sağa, orta amaca, absbottom, taban çizgisi ve texttop dahil olmak üzere birkaç farklı seçenek vardır. Bu etiketler ayrıca sayfadaki metnin resimle nasıl aynı hizada olduğunu belirlemeye yardımcı olur.
