טיפים מ-DevTools: איך לבדוק ולנפות באגים ב-flexbox של CSS
bookmark_borderbookmark
קל לארגן דפים בעזרת אוספים
אפשר לשמור ולסווג תוכן על סמך ההעדפות שלך.
Sofia Emelianova
כלי הפיתוח ל-Chrome מאפשרים לנפות באגים בתצוגות של flexbox ב-CSS באופן אינטואיטיבי. בחלונית Elements יש כלי עריכה של Flexbox שמתאים את עצמו להקשר, וגם שכבת-על שניתן להתאים אישית.
בסרטון הזה מוסבר איך:
אתם יכולים להשתמש בכלי לעריכת Flexbox כדי לשנות את מאפייני ה-Flexbox בלחיצה על לחצן, במקום להקליד אותם.
כדי לראות את השינויים מיד, אפשר להפעיל או להשבית את שכבת-העל של Flexbox בחלון התצוגה.
בקטע Elements (רכיבים) > Layout (פריסה) > Flexbox (Flexbox) תוכלו לראות רשימה של כל הרכיבים ולאתר אותם בעץ ה-DOM. בנוסף, אפשר להתאים אישית את צבעי שכבת-העל כאן.
[[["התוכן קל להבנה","easyToUnderstand","thumb-up"],["התוכן עזר לי לפתור בעיה","solvedMyProblem","thumb-up"],["סיבה אחרת","otherUp","thumb-up"]],[["חסרים לי מידע או פרטים","missingTheInformationINeed","thumb-down"],["התוכן מורכב מדי או עם יותר מדי שלבים","tooComplicatedTooManySteps","thumb-down"],["התוכן לא עדכני","outOfDate","thumb-down"],["בעיה בתרגום","translationIssue","thumb-down"],["בעיה בדוגמאות/בקוד","samplesCodeIssue","thumb-down"],["סיבה אחרת","otherDown","thumb-down"]],["עדכון אחרון: 2022-09-01 (שעון UTC)."],[],[]]