Studio Editor: מידע בנושא עריכת CSS

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

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

ה-CSS גם נותן לכם את החופש להנפיש אלמנטים איך שאתם רוצים, ליצור אנימציות משלכם עם מאפיינים שאתם רוצים, ואפילו להפעיל כמה אנימציות על אלמנט מסוים לפי הצורך.

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

ב-Studio Editor האלמנטים מחולקים לקלאסים (class) סמנטיים כדי שתוכלו לערוך חלקים ספציפיים. לדוגמה, לכפתורים יש 3 קלאסים של CSS:

אחרי שתבחרו קלאס מהרשימה, הוא יתווסף אוטומטית לקוד כדי שתוכלו להתחיל לעבוד.

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

חלונית ה-Code ב-Editor כוללת עמוד CSS גלובלי עבור כל השינויים שביצעתם. הקוד בעמוד הזה תקף לכל עמודי האתר, לכל אלמנט עם הקלאס הרלוונטי.

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