חלונות קופצים או חלונות קופצים הופכים פופולריים יותר ויותר באינטרנט. או יותר פשוט תמונות קופצות. בעלי אתרים רבים נאלצים להכין אותם למטרות פרסום, אך לא כולם מכירים את האלגוריתם ליצירתם.
זה הכרחי
- - עורך HTML;
- - מחברת;
- - אירוח.
הוראות
שלב 1
צור או פתח דף אינטרנט חדש ב- HTML או בעורך טקסט. ניתן להשתמש בתוכניות פופולריות כגון Dreamweaver, Expression Web ואחרות למטרה זו. אם אתה רק עושה את צעדיך הראשונים בשפת התכנות HTML, השתמש ב"פנקס רשימות "רגיל.
שלב 2
הדבק את הקוד הבא בין התגים "head" ו- "/ head":
.thumbnail {עמדה: קרוב משפחה; z-index: 0;}
.thumbnail: רחף {רקע-צבע: שקוף; z-index: 50;}
טווח תמונה ממוזערת {/ * CSS לתמונה מוגדלת * / מיקום: מוחלט; צבע רקע: צהוב בהיר; ריפוד: 5 פיקסלים; משמאל: -1000 פיקסלים; גבול: 1px אפור מקווקו; נראות: נסתר; צבע שחור; קישוט טקסט: אין;}
. תמונה ממוזערת img {/ * CSS לתמונה מוגדלת * / רוחב הגבול: 0; ריפוד: 2 פיקסלים;}
תמונה ממוזערת: טווח רחף {/ * CSS לתמונה מוגדלת ברחף * / נראות: גלוי; למעלה: 0; משמאל: 65 פיקסלים; / * המיקום שבו התמונה המוגדלת אמורה להתקזז אופקית * /}
שלב 3
התאם את הקיזוז האופקי של תמונת הקופץ על ידי שינוי הערך בשורת הקוד האחרונה. הקצה רווח בין התגים "body" ו- "/ body" במקום בו תרצה שהתמונה תופיע בדף האינטרנט. לאחר מכן העתק והדבק את הקוד הבא:
דוגמה לכותרת טקסט
דוגמה לכותרת טקסט"
שלב 4
החלף את "folder / largepci1.jpg" בקובץ המשמש לצילום הקופץ. בצע את אותו הדבר עם גוש הקוד השני. שנה את השורה "דוגמה לכותרת הטקסט" בה למה שצריך לכתוב בתמונה המוקפצת. שנה גם את ערכי הגובה והרוחב בקוד בכדי להתאים את גודל התמונה המוקפצת. צור גושי קוד נוספים כדי להוסיף סקיצות נוספות. הזן תכונות, תגים וטקסט אחרים במסמך ה- HTML לפי הצורך. שמור את קובץ ה- HTML ואז העלה אותו לשרת האינטרנט שלך.
