וובמאסטר - תיכנות ובניית אתרים

מדריך HTML – תגיות נפוצות: תמונות

גיא בורשטיין/‏ 11 ספטמבר, 2003
F+
F-

תמונות <img>

כדי להוסיף תמונות למסמך שלנו נשתמש ברכיב <img> שהוא רכיב מיוחד מכיוון שאין לו תגית סגירה. מכיוון שעלינו לומר לדפדפן היכן למצוא את קובץ התמונה ומה המימדים שלה עלינו להוסיף לרכיב התמונה מאפיינים המציינים מידע זה. המאפיינים של תגית HTML הם צמדים של שם + ערך הנכתבים כחלק מתגית הפתיחה של הרכיב.

לתגית התמונה יש ארבעה מאפיינים (attributes בלעז) עיקריים המאפשרים לנו לציין את המידע הדרוש לדפדפן להציג את התמונה כראוי:

  • src - הנתיב המלא או היחסי לקובץ התמונה באתר
  • width - רוחב התמונה בפיקסלים (לא חובה)
  • height - גובה התמונה בפיקסלים (לא חובה)
  • alt - טקסט חלופי לתמונה עבור קוראי מסך המשמשים גולשים הסובלים מלקות ראיה

 

לדוגמא:

<img src="http://www.webmaster.org.il/images/logo.gif" 
     width="254" height="63" alt="webmaster logo" 
/>

אם נריץ את הדף בדפדפן, נקבל את התוצאה הבאה:

HTML תמונות

חשוב לשים לב לכך שאופן כתיבת מאפיין לרכיב HTML הוא מאפיין="ערך" כאשר שם המאפיין תמיד יהיה באנגלית ובאותיות קטנות וערך המאפיין תמיד יהיה בתוך מרכאות כפולות. כמו כן יש לשים לב לכך שלרכיב img אין תגית סגירה ולכן נסגור אותו ע"י צירוף התווים רווח ולוכסן קדמי לפני סימן הסגירה של התגית (סימן <).

גיא בורשטיין

גיא בורשטיין הוא מומחה טכנולוגיות פיתוח בחברת מיקרוסופט ואחראי על הקשר בין מיקרוסופט לקהילת המפתחים בארץ.
תגיות: HTML‏  /  מדריך‏  /  בניית אתרים‏  

תגובות בפייסבוק

תגובות למאמר



תגיות פופולאריות

X
הצטרף לעמוד שלנו בפייסבוק להישאר מעודכן!
וובמאסטר © כל הזכויות שמורות