Get Adobe Flash player
דף הבית עקרונות ותחביר תחביר

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

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

  • בורר (Selector). הבורר הוא שם התג אותו רוצים לשנות או שם הסגנון החדש אותו רוצים ליצור
  • מאפיין (Property) המקביל בתפקודו ל"תכונה" בתג. המאפיין אומר את מה רוצים לשנות. חשוב: המאפיין זהה בתפקוד לתכונה, אולם שמותיהם שונים. תכונת סוג הגופן בתג <font> היא face, והמקבילה לה ב CSS היא font-family. לכל מאפיין יש ערך
  • ערך: המידה אותם מקנים למאפיין. אם המאפיין הוא צבע - יהיה זה שם המבע, אם הוא גודל, הוא יהיה במספר. חשוב: ערכים מספרים מלווים תמיד עם יחידת המידה. למשל 14px

דוגמא למבנה הוראת CSS

כללי הכתיבה

  • כל הטקסט ייכתב באותיות קטנות.
  • חלק ההצהרה מוקף בסוגריים מסולסלות
  • כל הצהרה מסתיימת ב'נקודה פסיק' (;)
  • שם המאפיין בנוי לרוב (לא בהכרח) משתי מילים מופרדות במקף מרכזי. אין להכניס רווחים בין מילים אלו!
  • הערך בנוי לעיתים ממספר. במקרה כזה יתווספו אליו תמיד יחידות. אין לשים רווח בין המספר לבין היחידות. יש דפדפנים (Firefox למשל) שבהם אין זה חוקי.
  • מספר המאפיינים בכל בורר אינו מוגבל.

חיבור תכונות

כאשר ניתנות הוראות עיצוב לתג בשתי (או בשלוש) רמות שונות, התוצאה הסופית תהיה חיבור של התכונות השונות, אך במקרה של תכונות זהות בעלות

ערכים שונים, התכונה שתדבע, תהיה זו הקרובה יותר אל נקודת העיצוב.

למשל, בקובץ החיצוני נכתוב:

body {
   color: navy;
   font-size: 14px;
         }

ובגוף הדף נכתוב:

body {
   font-family: arial;       
   font-size: 12px;
         }

התוצאה המשולבת תהיה:

body {
   color: navy;
   font-family: arial;       
   font-size: 12px;
         }

הערות בתוך ההוראות

 

לכתיבת ההערות ו/או טקסט לתיעוד ב CSS צריך לסמן את הטקסט כך שיהיה ברור שאינו הוראה.

השיטה לכתיבת הערה היא ע"י לוכסן וכוכבית בתחילת הטקזסט, והיפוכן (כוכבית ולוכסן) בסוף הטקסט.

דוגמא:

/* הבורר הבא מיועד לשינוי צורת ה-Body /*
body {
   color: navy;
   font-size: 14px;
         }
אל השיעור הקודם אל השיעור הבא