התאמה אישית
למד כיצד ליצור עיצוב, להתאים אישית ולהרחיב את Bootstrap עם Sass, מטען של אפשרויות גלובליות, מערכת צבעים נרחבת ועוד.
סקירה כללית
ישנן מספר דרכים להתאים אישית את Bootstrap. הדרך הטובה ביותר שלך יכולה להיות תלויה בפרויקט שלך, במורכבות של כלי הבנייה שלך, בגרסה של Bootstrap שבה אתה משתמש, בתמיכה בדפדפן ועוד.
שתי השיטות המועדפות עלינו הן:
- שימוש ב-Bootstrap דרך מנהל החבילות כדי שתוכל להשתמש בקבצי המקור שלנו ולהרחיב אותם.
- שימוש בקבצי ההפצה הקומפולטים של Bootstrap או jsDelivr כדי שתוכל להוסיף או לעקוף את הסגנונות של Bootstrap.
אמנם איננו יכולים להיכנס לפרטים כאן כיצד להשתמש בכל מנהל חבילות, אך אנו יכולים לתת הנחיות לגבי השימוש ב-Bootstrap עם מהדר Sass משלך .
למי שרוצה להשתמש בקבצי ההפצה, עיין בדף ההתחלה כיצד לכלול את הקבצים הללו ודף HTML לדוגמה. משם, עיין במסמכים לגבי הפריסה, הרכיבים והתנהגויות שבהן תרצה להשתמש.
בזמן שאתה מכיר את Bootstrap, המשך לחקור את הסעיף הזה לפרטים נוספים על איך להשתמש באפשרויות הגלובאליות שלנו, לעשות שימוש במערכת הצבעים שלנו ולשנות אותה, איך אנחנו בונים את הרכיבים שלנו, איך להשתמש ברשימה ההולכת וגדלה שלנו של מאפייני CSS מותאמים אישית, וכיצד כדי לייעל את הקוד שלך בעת בנייה עם Bootstrap.
CSPs ו-SVGs משובצים
מספר רכיבי Bootstrap כוללים SVGs משובצים ב-CSS שלנו כדי לעצב רכיבים באופן עקבי ובקלות בין דפדפנים ומכשירים. עבור ארגונים עם תצורות CSP קפדניות יותר , תיעדנו את כל המופעים של ה-SVGs המוטבעים שלנו (שכולם מיושמים באמצעות background-image
) כדי שתוכל לסקור בצורה יסודית יותר את האפשרויות שלך.
- אַקוֹרדִיוֹן
- בקרות קרוסלה
- לחצן סגירה (משמש בהתראות ובאופנים)
- תיבות סימון של טופס ולחצני בחירה
- מתגי טופס
- סמלי אימות טפסים
- לחצני החלפה של סרגל הניווט
- בחר תפריטים
בהתבסס על שיחה בקהילה , כמה אפשרויות לטפל בזה בבסיס הקוד שלך כוללות החלפת כתובות האתרים בנכסים המתארחים מקומית , הסרת התמונות ושימוש בתמונות מוטבעות (לא אפשרי בכל הרכיבים) ושינוי ה-CSP שלך. ההמלצה שלנו היא לבדוק היטב את מדיניות האבטחה שלך ולהחליט על הדרך הטובה ביותר קדימה, במידת הצורך.