Kod : <img src=”dosyaismi.gif”>
Text ve Gömülen Resimin Düzeni
Kod : <img…> belirteciyle bazı özellikleri kullanarak text ve resim arasında nasıl bir düzen olmasını istiyorsanız ayarlayabilirsiniz. <img> belirtecinin içine yerleştirilen align özelliği sayesinde aşağıdaki efektleri yapabilirsiniz:
align=top
Kod:
<img align=top src=”dosyaismi.gif>
Yazı buraya gelecek. Dikkat ederseniz, ilk satırdan sonraki yazı
boşlukları dolduruyor.
align=middle
Kod:
<img align=middle src=”dosyaismi.gif”>
Yazı buraya gelecek. Bu sefer “align=middle” yani “orta” dediğimiz
için yazı grafiğin ortasından devam ediyor.
align=bottom (normal)
Kod:
<img align=bottom src=”dosyaismi.gif”>
Yazı bu sefer buraya gelecek. “align=bottom” demekle yazının en
alt kısımda olacağını belirttik.
HTML Dökümanımıza Resim Yerleştirelim
Bu çalışmada, üzerinde çalıştığımız dökümana bir giriş resmi koyacağız.
Çalışmanızı, açık değilse tekrar açın.
Text editörünüzde volkanlar.html dosyasını açın.
<h1>Volkanlar Sayfası<h1> başlığının üzerine şunu yazın:
Kod:
<img src=”lava.gif”>
Bu belirteç, sayfanızın en üstüne daha önce bulduğunuz volkan resimini yerleştirir. “lava.gif”, bu dosyanızın ismidir; eğer dosyanızın ismi değişikse, “lava.gif” yerine o ismi yazmalısınız.
Dosyanızı kaydedin ve browserınızda tekrar yükleyin.
NOT: Dikkat etmeniz gereken nokta, lava.gif ya da kullandığınız resim dosyası HTML dökümanınızla aynı dizinde olmalıdır. Eğer değilse, dosyanın bulunabileceği yerin tam yolunu yazmalısınız.
Resimi yerleştirdiğinizde aklınıza neden resim belirtecinden sonra <p> belirtecini kullanmadığınız gelebilir, bunun sebebi resim belirtecinden hemen sonraki belirtecin bir başlık <hN> belirteci olmasıydı; daha önce gördüğümüz gibi bir browser başlık belirteçlerinden önce ve sonra bir satır boşluk bırakır (paragraf belirtecine gerek kalmaz).