הוספת תמונה

התג img> >-תפקידו להכניס תמונה למסמך כאשר נוסיף לו את המאפיין src  שתפקידו לציין את מקור קובץ התמונה
 picture.jpg, picture.gif) )כלומר את שמו ואת מיקומו. מיקום הקובץ הנו מסלולו באם התמונה אינה נמצאת באותה תיקיה בה הקובץ שלנו נמצא.

 

מאפיינים נוספים הנלווים לתג הנם:

height–אורך התמונה.

width–רוחב התמונה

alt – טקסט חילופי

border –מסגרת התמונה

align – מיקום יחסית לטקסט המלווה

 

 

גודל התמונה

גודל התמונה מוגדר ע"י המאפיינים height ו – width. יש ביכולתנו לבחור את מידות התמונה ע"י הגדרת מספר פיקסלים או אחוזים. יש לשים לב שהערכים יהיו פרופורציונלים כדי שלא נראה עיוותים בתמונה. להלן מספר דוגמאות:

 

 

 

 

 

 טקסט חלופי

טעינת התמונות ע"י הדפדפן לוקחת זמן. על מנת שהמשתמש ידע איזו תמונה אמורה להופיע ניתן להשתמש במאפייןalt . הערך הנלווה לו יהיה הסבר מילולי לתמונה עד שתופיע על המסך. תכונת זו גם מאפשרת למחשב להציג את ההסבר ככתובית צהובה ToolTip המופיעה ליד סמן העכבר בעת שהוא עומד על התמונה.

src=”simpson.jpg” alt=”משפחת סימפסון"> img>

נסו זאת על התמונות שלמעלה!

 

 

מסגרת

ניתן להוסיף מסגרת לתמונה באמצעות המאפיין border  כאשר הערך הנלווה לו יהיה עובי המסגרת המוגדר בפיקסלים לדוג':
img src="*.jpg" border="2">   >

בתמונות הבאות שנראה, זהו עובי המסגרת שנבחר.

 

 

יישור הטקסט כלפי התמונה

למדנו להכיר את המאפיין align  שתפקידו  לגרום ליישור הטקסט יחסית לתמונה. הערכים הנלווים למאפיין זה הנם:

 align="bottom" - ברירת המחדל. הטקסט בתחתית התמונה.

 

Megi Simpson

 - align="middle"הטקסט במרכז גובה התמונה.

Megi Simpson

align="top" - הטקסט בגובה "כתפי" התמונה.

Megi Simpson

align="right" - הטקסט משמאל לתמונה שנמצאת בצד ימין.

Megi Simpson

 

align="left" - הטקסט מימין לתמונה שנמצאת בצד שמאל.

Megi Simpson