Sofia Emelianova
במדריך הזה אנחנו יוצאים מנקודת הנחה שאתם מכירים את בדיקת ה-CSS ב-Chrome DevTools. במאמר הצגה ושינוי של CSS מוסבר על העקרונות הבסיסיים.
בדיקת ה-CSS שאתם יוצרים
נניח שהוספתם קוד CSS לאלמנט ואתם רוצים לוודא שהסגנונות החדשים הוחלו בצורה תקינה. כשתרעננו את הדף, האלמנט ייראה כמו קודם. משהו השתבש.
הדבר הראשון שצריך לעשות הוא לבדוק את הרכיב ולוודא שקוד ה-CSS החדש אכן מיושם על הרכיב.
לפעמים, הקוד החדש של ה-CSS יופיע בחלונית Elements (רכיבים) > Styles (סגנונות), אבל הוא יופיע בטקסט חיוור, לא ניתן לעריכה, מחוק או עם סמל אזהרה או רמז לידו.
הסבר על CSS בחלונית 'סגנונות'
בחלונית Styles (סגנונות) מתבצעת זיהוי של סוגים רבים של בעיות ב-CSS והן מודגשות בדרכים שונות.
בוררים שהותאמו ובוררים שלא הותאמו
בחלונית Styles (סגנונות), הבוררים שתואמים לקוד מופיעים בטקסט רגיל, והבוררים שלא תואמים מופיעים בטקסט חיוור.