27 Haziran 2011 Pazartesi

Resim ve Yazılar

<img align=#>
#=left, right, top, middle, bottom, none, all
align parametresi, resmin etrafındaki metnin ne şekilde hizalanacağını tanımlar. İlgili metnin bir satırının resmin üstünde,  altında, ortasında, solunda veya sağında  yerleşeceğini belirtir. Varsayılan değer none’dır.
Şekil 12. Metin sola ve Resmin sağa hizalanması
Program Şekil 12.’den de görüldüğü gibi resmi sayfanın sağına ve metni resmin soluna hizalar.
<html><head></head>
<body>
<img src="ladin2.jpg" align="right">
<br><br>
<h3>Ladin otel İzmir'in Çeşme ilçesinin Dalyan köyündedir.</h3>
</body>
</html>
Örnek:
<html><head></head>
<body>
<h4><img src="ladin2.jpg" align="top">Ladin otel İzmir'in Çeşme ilçesinin Dalyan köyündedir.</h4>
</body>
</html>


Tarayıcı sayfasındaki görünüm Şekil 13.’de görüldüğü gibi olacaktır.
Şekil 13. Resim ve metnin  görünümü
<br clear=#>
#=none, left, right, all
<br clear=#>, metnin resmin hemen yanında, solunda, sağında, altında  yada sağ ve sol marjinlerin yanında görüntülenmesini sağlar.
<html><head></head>
<body>
<img src="ladin2.jpg" align="left">
<br clear="right">
<h4>Ladin otel İzmir'in<br> Çeşme ilçesinin<br> Dalyan köyündedir.</h4>
<br><br><br><br><br><br>
<img src="ladin2.jpg" align="left">
<br clear="all">
<h4>Ladin otel İzmir'in<br> Çeşme ilçesinin<br> Dalyan köyündedir.</h4>
</body>
</html>


     Şekil 14. Web sayfasının görünümü
<img vspace=# hspace=#> #=değer
Resmin etrafındaki yatay(horizontal) ve düşey(vertical> boşluğu piksel olarak belirler.
Yatay boşluk, resmin sağında ve solundaki boşluk miktarı.
Düşey boşluk, resmin altında ve üstündeki boşluk miktarı.
<html><head></head>
<body>
<img src="ladin2.jpg" align="left"  vspace=40 hspace=80><br>
<h4>Ladin otel İzmir'in Çeşme ilçesinin<br> Dalyan köyündedir.</h4>
</body>
</html>
      Şekil 15. Web sayfasının görünümü
<img src=”url” border=#>  #=değer
border parametresi yardımıyla, resimlerin etrafına istenilen kalınlıkta çerçeve(sınır) konulur.
<html><head></head>
<body>
<img src="ladin2.jpg" align="left"  vspace=25  hspace=50 border=5>

</body> </html>
Şekil 16. Web sayfasının görünümü
Resmin Boyutları
<img src=”url” width=”#” height=”#”>
#=piksel cinsinden değer
Resmin orijinal boyutları ne olursa olsun, Width(genişlik) ve Height(yükseklik) parametreleri web sayfasında görüntülenen resmin boyutlarını ayarlar.
<html><head></head>
<body>
<img src="ladin2.jpg" align="left"  width="100" height="100">
</body>

</html>
Şekil 17. Web sayfasının görünümü

1 yorum: