מבוא לשפת CSS

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

מה זה CSS

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

להלן דוגמה לקוד CSS. אין צורך בשלב זה להבין את הקוד וכל מטרתו להדגים כיצד נראה קוד CSS:

דוגמה לטקסט עם קו עילי
#p1 {text-decoration:overline;}
דוגמה לטקסט עם קו חוצה
#p2 {text-decoration:line-through;}
דוגמה לטקסט עם קו תחתי
#p3 {text-decoration:underline;}
דוגמה לטקסט מהבהב
#p4 {text-decoration:blink;}

למה צריך CSS

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

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

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

איזה תוכנות נדרשות כדי לכתוב קוד  CSS?

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

 

 
© 2010-2013  www.Devschool.co.il | מדיניות פרטיות | תנאי שימוש