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

אמנם השימוש בו ירד בשנים האחרונות עקב אימוץ טכניקות מודרניות וגמישות יותר, כגון CSS ו JavaScript, עדיין ניתן למצוא באתרים מסוימים, במיוחד אלה שנוצרו בשנות ה-90 ותחילת שנות ה-90. זה של 2000.

כיצד פועלות מסגרות או מסגרות ב-HTML?

מסגרות מורכבות משני אלמנטים:

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

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

• לעקוב עם: דוגמאות iFrame

כיצד ליצור מסגרות ב-HTML

כדי ליצור מסמך HTML עם מסגרות, בצע שני שלבים פשוטים מאוד:

1. צור מסמך HTML שמגדיר את מבנה המסגרות באמצעות האלמנט. לדוגמה:

קובץ 1: frameset.html

2. צור מסמך HTML אחד או יותר שייטען בתוך המסגרות.

קובץ 2: frame1.html

זו מסגרת 1

קובץ 3: frame2.html

זה מסגרת 2

תכונות מסגרת ב-HTML

כמה מתכונות האלמנט החשובות ביותר הם:

• גְלִילָה: תכונה זו משמשת לשליטה במראה פסי הגלילה במסגרת. זה יכול לקבל את הערכים "אוטומטי", "כן" או "לא".

• noresize: תכונה זו משמשת כדי למנוע מהמשתמש לשנות את גודל המסגרת.

• יאם: תכונה זו משמשת כדי לתת למסגרת שם, שיכול להיות שימושי להפניה למסגרת בקישורים ובסקריפטים.

• src: תכונה זו משמשת לציון כתובת האתר של מסמך ה-HTML שיטען במסגרת.

• גבול המסגרת: תכונה זו מציינת אם למסגרות יש גבולות או לא. ערכים אפשריים הם "1" (להצגת גבולות) או "0" (ללא הצגת גבולות). לדוגמה, .

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

• ריווח מסגרות: תכונה זו דומה ל גבול. זה גם מגדיר את הרווח בין הפריימים בפיקסלים. לדוגמה, יגדיר פער של 10 פיקסלים בין הפריימים.

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

דוגמה לשימוש:

כיצד לקשר למסגרת ספציפית

אנו יכולים לפתוח קישור במסגרת ספציפית באמצעות התכונה יַעַד בתווית. הערך של יַעַד צריך להיות זהה לשם המסגרת (יאם תכונה של ). לדוגמה:

ב-menu.html
עמוד 1
עמוד 2

במקרה זה, לחיצה על הקישורים "עמוד 1" או "עמוד 2" במסגרת התפריט תטען את העמוד המתאים במסגרת "התוכן".

איך לשבור את המסגרות

אם אתה רוצה קישור לפתיחת דף מחוץ למסגרות (כלומר להחליף את כל המסגרת), תוכל להשתמש בערך המיוחד _חלק עליון עבור התכונה יַעַד. לדוגמה:

ב-menu.html
לצאת ממסגרות

כאשר תלחץ על "צא מסגרות", הדפדפן יטען את "pageOutofFrames.html" בחלון המלא, ויחליף את ערכת המסגרות.

דוגמה לחלוקת המסך לשתי עמודות עם מסגרות

דוגמה זו מחלקת את המסך לשתי עמודות בגודל שווה. כל עמודה טוענת דף HTML אחר.

דוגמה ליצירת סרגל צד ניווט עם מסגרות

דוגמה זו יוצרת סרגל צד שתופס 25% מהמסך ומשמש לניווט. שאר המסך משמש להצגת התוכן הראשי.

דוגמה לחלוקת המסך לשורות ועמודות

הדוגמה המורכבת יותר הזו מחלקת את המסך לארבעה חלקים שווים. כל קטע טוען דף HTML אחר.

דוגמה לניווט עליון עם מסגרות HTML

צור קובץ שמגדיר שתי מסגרות ברצף. שני הקבצים שהיא מגדירה הם: אחד עבור הניווט (התופס 20% מרוחב החלון) ואחד עבור התוכן הראשי (התופס את שאר רוחב החלון).

לאחר מכן, תצטרך ליצור את הקבצים "navigation.html" ו-"content.html". לדוגמה, "navigation.html" עשוי להיראות כך:

עמוד 1

עמוד 2

עמוד 3


ו-"content.html" יכול להיות משהו כזה:

ברוך הבא לאתר שלנו!

כאן יגיע תוכן העמוד שנבחר בניווט.

במקרה זה, כאשר אתה לוחץ על קישור ב-"navigation.html", הדף המתאים נטען במסגרת "תוכן".