בשפת סימון ההיפר-טקסט (HTML), משתמשים בפקודה "תג" מיוחדת להצגת תמונה בעמוד. תג זה מכונה img ומכיל קבוצת משתנים - "תכונות". בעזרת תכונות תוכלו לקבוע את כל ההיבטים בתצוגת תמונה בעמוד היפר טקסט, כולל מידותיו. עם זאת, זו לא הדרך היחידה לפתור את הבעיה - ניתן גם להקטין את גודל התמונה באמצעות Cascading Style Sheets (CSS).
הוראות
שלב 1
הצב את תכונות הגובה והרוחב בתג האחראי על הצגת התמונה הרצויה. הגדר את הראשון לגודל האנכי של התמונה, והשני לרוחב. הגדר את שני המספרים בפיקסלים, אך אין צורך לציין יחידות - px - כאן. בעת חישוב הערכים הדרושים לתכונות אלה, שים לב לשמירה על הפרופורציות של צמצום התמונה, אחרת היא תוצג בצורה מעוותת. לדוגמא, כדי להכניס לדף תמונה חצויה מקובץ בשם SomePic.jpg, שממדיו הראשוניים הם 500 על 300 פיקסלים, ניתן לבצע את התג באמצעות הפקודה הבאה:
שלב 2
ניתן להגדיר את ההפחתה היחסי של ממדי התמונה המקוריים באחוזים. לשם כך, השתמש רק במאפיין גובה מבלי לציין רוחב, והוסף סימן אחוז לאחר ציון המספר המגדיר את הגודל. לדוגמא, תוכל להשיג את אותו האפקט כמו בדוגמה מהשלב הקודם באמצעות תג שנכתב בצורה זו:
שלב 3
אם ברצונך לציין את גודל התמונה באמצעות תיאור הסגנונות, השתמש באותו שם תג - img - ובתכונות - רוחב וגובה. במקרה זה, תמיד יש לציין את יחידות המידה - px, pt או%. כדי להגדיר את מחצית הגודל של כל התמונות בדף, הצב את הערך הבא בגוש תיאור הסגנון: img {גובה: 50%;} אם אתה צריך להקטין את הגודל של תמונה אחת בלבד, הוסף מאפיין מזהה נוסף לתג שלו והקצה אותו ייחודי לתמונות של ערך דף זה - למשל, PicOne: הוסף את אותו ערך לרשומת הסגנון, והפריד אותו עם "hash" # משם התג. תיאור הסגנון השלם במקרה זה עשוי להיראות כך: img # OnePic {גובה: 50%;}
