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

הוספת כתוביות HTML לתמונות אינטרנט ב 9 שלבים פשוטים

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

9 שלבים לכיתוב תמונה HTML

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

1. הוסף תמונה לדף האינטרנט שלך.
2. ב- HTML עבור דף האינטרנט שלך, מקם תג div סביב התמונה:
3. הוספת מאפיין סגנון לתג div:
   style = "" >
4. הגדר את רוחב ה- div לרוחב זהה לתמונה, עם מאפיין סגנון הרוחב :
   width: width width;; >
5. עבור כיתובים קטנים מעט מהטקסט המקיף, הוסף מאפיין בגודל גופן לסגנון div:
   font-size: 80%; ">
6. כיתובים נראים בצורה הטובה ביותר אם הם ממוקדים מתחת לתמונה, לכן הוסף נכס ליישר טקסט לתכונת הסגנון:
   text align: center; "> < img src = "URL" alt = "טקסט חלופי" width = "width" height = "height" />
7. לבסוף, הוסף רווח נוסף בין התמונה לבין הכיתוב, על-ידי הוספת מאפיין סגנון לתמונה עם מאפיין סגנון ריפוד תחתון :
   style =" padding-bottom: 0.5em; " />

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

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

טיפים הכיתוב

• רוחב : מידות CSS יכולות להיות במידות רבות ושונות, לכן בדרך כלל עליך לכלול את סוג המדידה. לדוגמה: רוחב: 100 פיקסלים ; עם זאת, ממדי תמונת HTML תמיד נמצאים בפיקסלים, כך שתשאיר את המדידה כבוי. רוחב = "100"
• אם אתה הופך את רוחב ה- div רחב יותר מרוחב התמונה, הכיתוב עשוי להופיע לצד התמונה. אם זהו מה שאתה רוצה, הוסף תג
  ישירות לפני הכיתוב ולאחר תג התמונה.