הסגנון החזותי של האתר ואת הפריסה הם מוכתבים על ידי CSS או גיליונות סגנון מדורגים. אלה מסמכים המעצבים סימון HTML של דף אינטרנט, המספק לדפדפני אינטרנט הוראות כיצד להציג את הדפים הנובעים מסימון זה. CSS מטפל בפריסת עמוד, כמו גם צבע, תמונות רקע, טיפוגרפיה ועוד.
אם אתה מסתכל על קובץ CSS, תראה כי כמו כל סימון או שפת קידוד, קבצים אלה יש תחביר ספציפי אליהם. כל גיליון סגנונות מורכב ממספר כללי CSS. כללים אלה, כאשר נלקח במלואו, הם מה סגנונות האתר.
החלקים של כלל CSS
כלל CSS מורכב משני חלקים נפרדים - בורר והצהרה. בורר קובע מה הוא מנוסח על הדף ואת ההצהרה היא איך זה צריך להיות מנוסח. לדוגמה:
p { צבע: # 000;} זהו כלל CSS. החלק בורר הוא "p", שהוא בורר אלמנטים עבור "פסקאות". זה היה, אם כן, בחר את כל פסקאות באתר ולספק להם סגנון זה (אלא אם כן יש פסקאות אשר ממוקד על ידי סגנונות ספציפיים יותר במקום אחר במסמך ה- CSS שלך). החלק של הכלל שאומר "צבע: # 000;" היא מה שמכונה ההצהרה. הצהרה זו מורכבת משני חלקים - הנכס והערך. הנכס הוא חתיכת "צבע" של הצהרה זו. זה מכתיב איזה היבט של בורר ישתנו חזותית. הערך הוא מה ישתנה המאפיין CSS שנבחר. בדוגמה שלנו, אנו משתמשים בערך hex של # 000, שהוא CSS קצרנות עבור "שחור". אז באמצעות כלל CSS זה, הדף שלנו יהיה פסקאות המוצגות בצבע גופן של שחור. כאשר אתה כותב תכונות CSS, אתה לא יכול פשוט להפוך אותם כפי שאתה רואה לנכון. עבור מקרים, "צבע" הוא מאפיין CSS בפועל, כך שתוכל להשתמש בו. מאפיין זה קובע את צבע הטקסט של אלמנט. אם ניסית להשתמש "צבע טקסט" או "צבע גופן" כמו CSS תכונות, אלה ייכשל כי הם לא חלקים בפועל של שפת CSS. דוגמה נוספת היא המאפיין "תמונת רקע". מאפיין זה מגדיר תמונה שניתן להשתמש בה עבור רקע, כגון: .logo { background-image: url (/images/company-logo.png);} אם ניסית להשתמש "תמונת רקע" או "רקע רקע" כמאפיין, הם נכשלים כי, שוב, אלה אינם מאפייני CSS בפועל. קיימים מספר תכונות CSS שבהן ניתן להשתמש כדי לסגנן אתר. חלק מהדוגמאות הן: תכונות CSS אלה נהדרות להשתמש בהן כדוגמאות, משום שהן כולן פשוטות מאוד, גם אם אינך יודע CSS, אתה יכול כנראה לנחש מה הם עושים על פי השמות שלהם. ישנם תכונות CSS אחרות כי תיתקל גם אשר לא יכול להיות ברור כמו איך הם עובדים על פי שמותיהם: כאשר אתה מקבל עמוק יותר לתוך עיצוב אתרים, תוכלו להיתקל (ולהשתמש) כל התכונות האלה ועוד! בכל פעם שאתה משתמש במאפיין, עליך לתת לו ערך - ומאפיינים מסוימים יכולים לקבל ערכים מסוימים בלבד. בדוגמה הראשונה שלנו של המאפיין "צבע", אנחנו צריכים להשתמש בערך צבע. זה יכול להיות ערך hex, ערך RGBA, או אפילו מילות מפתח צבע. כל אחד מהערכים האלה יעבוד, עם זאת, אם השתמשת במילה "קודר" עם המאפיין הזה, זה לא יעשה כלום כי, כפי תיאורית כמו מילה זו עשויה להיות, זה לא ערך מוכר ב- CSS. הדוגמה השנייה שלנו ל "תמונת רקע" מחייבת שימוש בנתיב תמונה כדי להביא תמונה בפועל מקובצי האתר שלך. זהו הערך / התחביר הדרוש. לכל מאפייני CSS יש ערכים שהם מצפים. לדוגמה: אם אתה עובר את רשימת המאפיינים CSS, תגלו כי לכל אחד מהם יש ערכים ספציפיים שהם ישתמשו כדי ליצור את סגנונות הם מיועדים. בעריכת ג'רמי ג'יררד יסודות נכס CSS
כמה תכונות CSS
מאפיינים זקוקים לערכים
