הוסף כיתוב שנשאר עם התמונה שלך תמונות

תמונות להוסיף חיים לדפי האינטרנט שלך למשוך את תשומת הלב של הצופים. כיתובים מספקים מידע נוסף על תמונות האינטרנט שלך, אך ניתן להוסיף אותם בקלות לדפי אינטרנט ללא יכולות HTML ו- CSS מתקדמות. הנה שיטה אמינה להוספת כיתוב פשוט, אך אטרקטיבי, לתמונה שנשמרת עם התמונה בכל מקום שבו תעביר אותה לדף האינטרנט.

שלבים לכיתוב Image HTML

1. הוסף תמונה לדף האינטרנט שלך.

2. ב- HTML עבור דף האינטרנט שלך, הוסף תג div מסביב לתמונה:

   

3. הוסף מאפיין סגנון לתג div:

   style = "">

   

4. הגדר את רוחב ה- div לרוחב זהה לתמונה, עם מאפיין סגנון הרוחב:

   

5. עבור כיתובים קטנים מעט מהטקסט המקיף, הוסף מאפיין בגודל גופן לסגנון div:

   

6. כיתובים נראים בצורה הטובה ביותר אם הם ממוקדים מתחת לתמונה, לכן הוסף מאפיין יישור טקסט לתכונת הסגנון:

   

7. לבסוף, הוסף רווח קטן נוסף בין התמונה לבין הכיתוב, על ידי הוספת מאפיין סגנון לתמונה עם מאפיין סגנון ריפוד-תחתון:

   סגנון = "ריפוד בתחתית: 0.5em;" />

8. לאחר מכן הוסף את כותרת הטקסט ישירות מתחת לתמונה:

העלה את דף האינטרנט לשרת שלך ובדוק אותו בדפדפן.

טיפים הכיתוב

• מידות CSS יכולות להיות במידות רבות ושונות, לכן בדרך כלל עליך לכלול את סוג המדידה. לדוגמה:

  רוחב 100px; עם זאת, ממדי תמונת HTML תמיד נמצאים בפיקסלים, כך שתשאיר את המדידה כבוי.

  רוחב = "100"

• אם אתה הופך את רוחב ה- div רחב יותר מרוחב התמונה, הכיתוב עשוי להופיע לצד התמונה. אם זה מה שאתה רוצה, ולאחר מכן להוסיף
  ישירות לפני הכיתוב ולאחר תג התמונה.