Resim Ekleme
*.jpg, *.png, *.gif * bmp ---- İnternetteki Resim formatı olarak kullanılır.*.tiff, *.eps, *.psd, *.cdr ---- Resim formatları internette kullanılmaz.
JPG; Kalite önemli ise jpg formatı kullanılır. Hareksiz resimler ve sayfanızın arka plan rengi ile uyumlu yapmanız gerekebilir.
GIF; Hareketli resimlerdir, sayfanızın arka plan rengi için transparan özelliği gösterir.
Örnek Kullanım
<img src="*.gif" alt="..." align=”...” border=”0”>
<img src=*.jpg>’nin Parametreleri
src="resimlerim/dosya-adi.gif" resmin adı dosya-adi.gif ve resimlerim klasöründe yer almaktadır.
Align ile de resmin konumunu belirleriz.
Resmin tarayıcıda bulan metne göre yerini belirlemek için
Resmin üstünü, metnin üst kısmı ile aynı hizaya getirmek için; align="top"
Resmin tabanını, metnin tabanı ile aynı hizaya getirmek için; align="bottom"
Metni resmin tam ortasına getirmek için; align="middle"
Resmin metne olan uzaklığını ise vspace ve hspace ile ayarlıyoruz.
vspace = Resmin, metne dikey uzaklığı.
hspace = Resmin, metne yatay uzaklığı.
Ayrıca resmi, metnin taban çizgisine hizalamak için align="baseline", metnin üst çizgisine hizalamak için align="texttop", metnin tam ortasına hizalamak için align="absmiddle" ve son olarak ta metnin alt çizgisine hizalamak için ise align="absbottom" elemanını kullanılırız.
Resmi Hizalamak
Resmi Sağa Hizalamak: align="right"
Resmi Sola Hizalamak: align="left"
Resmi Ortalamak: align="center"
Resmin Etrafındaki Metni Düzenleme
Resmi yerleştirdikten sonra hemen sonra metin yazarsanız metin resmin yanına gelecektir. Metin bir alt satıra kaydığında ise resmi atlayacaktır. Bir örnekle açıklayayım resminizin 5 cm büyüklüğünde olduğunu düşünün ve yanına bir metin yazın ve bu metin uzun bir metin olsun. Resimden sonra bir satır metin yazılacak ve alt satıra geçildiğinde 5 cm lik alan boş kalacaktır. İşte bunu önlemek için <img> tagının align elemanı kullanılır. Align elemanının kullanımını zaten biliyoruz, bu elemanın metin düzenlemede kullandığı iki değer vardır. Bunlar left ve right' dır.
border=resmin çerçevesini belirleriz ( 0 - 1 -2 -3 - …) sıfır degerini veya border komutu kullanmazsak çerceve içine alınmaz resim.Bu Çerceveye renk vermek için bordercolor=”red” kullanıyoruz.
Width ve height ile resmin boyutlarını belirleyebiliriz. Bu paremetreler kullanılmazsa orjinal boyutlarında gösterim yapılır.
Alt : ziyarecilere resim yüklenmesse resmin yerine açıklayıcı yazı çıkartır. ( Ayrıca mouse resim üzerine getirildiginde de aynı yazı çıkar.)
Not: Web Sayfanıza resim ekleyecekseniz resimleriniz boyutlarını göz önüne almanızda fayda var çünkü resim agırlık sayfaların internet te açılma süreleri geç olduğundan ziyaretcilerinizin için sıkıcı bir durum yaratacaktır.
Not: Sayfanın hızlı yükleniyor gibi sağlamanın bir yolu 'lowsrc' belirtecini <img .....> içinde kullanmak. Web tasarımı yaparken eğer kullandığımız resimlerin bir de bulanık/niteliksiz/siyah-beyaz ama az yer tutan bir benzerini daha yapar, ve bunu <img src="resim.gif" lowsrc="hizliresim.gif"> şeklinde tanımlarsak, ilk önce hizliresim.gif yüklenip gösterilecektir, Bu sayede bulanık iken yavaş yavaş netleşmeye başlayan resimler belirir sayfamızda.
|
|
|
