Get Adobe Flash player
דף הבית מודל התיבה מאפייני מסגרת התיבה

מאפייני סוג המסגרת

המאפיין להגדרת סוג המסגרת הוא border-style. הגדרת סוג המסגרת מחוייבת, ובלעדיה לא תוצג במסגרת כלל.

ערכי המאפיין - מסגרת דו-מימד (2D)

solid - מסגרת רציפה

dashed - מסגרת מקווקות

dotted - מסגרת מנוקדת

double - מסגרת כפולה

ערכי המאפיין - מסגרת תלת-מימד (3D)

מסגרות בעלות אופי של תלת מימד מושפעות מאוד מצבע המסגרת

 

groove - מסגרת "מחורצת"

ridge - מסגרת "מקומטת"

inset - מסגרת משוקעת

outset- מסגרת בולטת


ערכי המאפיין - מסגרות שאינן נראות

כאשר המאפיין מוגדר ל- none, אין כלל מסגרת. מצב ז\ה מיועד להתרת מסגרת למשל במצב של קישורים

כאשר המאפיין מוגדר ל- hidden, המסגרת מוסתרת. מיועד למקטעים הנשלטים למשל ע"י javascript.

מאפייני עובי המסגרת

המאפיין הקובע את עובי המסגרת הוא border-width וערכיו נקבעים באחת משתי האפשרויות הבאות:

  • מידה בפיקסלים
  • מתן אחד משלושה ערכים מוגדרים מראש: thin, medium, thick

כאמור, לא ניתן להגדיר עובי למסגרת, אם לא נקבע מראש את הסוג שלה.


מאפייני צבע המסגרת

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

ערכים יחידניים לצידי המסגרת

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

border-top-style: solid;
border-top-width: 2px;
border-top-color: red; 

שמות צידי המסגרת הם top (עליון), right (ימין), bottom (תחתון) ו-left (שמאל).

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

border-top-style : solid dotted dashed groove;

כל צד מקבל את ההגדרה הייחודית שלו על-פי כיוון תנועת השעון. ההגדרה הראשונה היא הצד העליון (solid), השנייה היא הימנית, השלישית - תחתונה והאחרונה היא השמאלית.

ריכוז המאפיינים בשורה אחת

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

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

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

אין חובה לציין את שלושתם, אך יש לזכור שסוג המסגרת חייב להיכתב.

דוגמא:

bored: 2px outset red;

כאמור, גם ההגדרה הבאה תקינה:

bored: 2px solid;

 

אל השיעור הקודם אל השיעור הבא