דף הבית  >> 
 >> 

הרשם  |  התחבר


מבוא לשפת CSS 

מאת    [ 14/06/2011 ]

מילים במאמר: 565   [ נצפה 2793 פעמים ]

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

מה צריך לדעת לפני שמתחילים ללמוד 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 אשר אמנם עושות לעתים קרובות את העבודה במקומנו אך באותו זמן מונעות מאיתנו בעצם ללמוד את השפה.

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

יוסי סיגורה מומחה בתחום Cloud Computing בעל ניסיון רב בפיתוח אתרים ואפליקציות. עורך האתר "קוד ענן" - http://www.codeanan.co.il/  ואתר המפתחים ללימוד עצמי  http://www.devschool.co.il




מאמרים חדשים מומלצים: 

חשיבות היוגה לאיזון אורח חיים יושבני  -  מאת: מיכל פן מומחה
היתרונות של עיצוב בית בצורת L -  מאת: פיטר קלייזמר מומחה
לגלות, לטפח, להצליח: חשיבות מימוש פוטנציאל הכישרון לילדים עם צרכים מיוחדים -  מאת: עמית קניגשטיין מומחה
המדריך לניהול כלכלת משק בית עם טיפים ועצות לניהול תקציב -  מאת: נדב טל מומחה
חשבתם שרכב חשמלי פוטר מטיפולים.. תחשבו שוב -  מאת: יואב ציפרוט מומחה
מה הסיבה לבעיות האיכות בעולם -  מאת: חנן מלין מומחה
מערכת יחסים רעילה- איך תזהו מניפולציות רגשיות ותתמודדו איתם  -  מאת: חגית לביא מומחה
לימודים במלחמה | איך ללמוד ולהישאר מרוכז בזמן מלחמה -  מאת: דניאל פאר
אימא אני מפחד' הדרכה להורים כיצד תוכלו לנווט את קשיי 'מצב המלחמה'? -  מאת: רזיאל פריגן פריגן מומחה
הדרך שבה AI (בינה מלאכותית) ממלאת את העולם בזבל דיגיטלי -  מאת: Michael - Micha Shafir מומחה

מורנו'ס - שיווק באינטרנט

©2022 כל הזכויות שמורות

אודותינו
שאלות נפוצות
יצירת קשר
יתרונות לכותבי מאמרים
מדיניות פרטיות
עלינו בעיתונות
מאמרים חדשים

לכותבי מאמרים:
פתיחת חשבון חינם
כניסה למערכת
יתרונות לכותבי מאמרים
תנאי השירות
הנחיות עריכה
תנאי שימוש במאמרים



מאמרים בפייסבוק   מאמרים בטוויטר   מאמרים ביוטיוב