מבוא ל-Bootstrap
זוהי סיפרייה המקלה על העבודה לפיתוח עיצוב רספונסיבי מהיר.
על ידי הוספת מחלקה מתאימה לאלמנט html,
לאחר שהוספנו לדיב האבא את הקלאס row.
לדוגמה:
col-lg-3
קובע אלמנט לגודל 25% של המסך, כיון שהמסך מחולק ל-12 כאלו.
במקרה זה במסכים גדולים זה יהיה כך.
על מנת שבמסך סמרטפון קטן זה יראה על כל המסך נוסיף עוד מחלקה המופרדת ברווח אחד.
col-xs-12
lg = מסכי מחשב רחבים
md = מסכי מחשב קטנים
sm = מסכי טבלטים עומדים
xs = מסכי סמרטפונים עומדים
אם מוגדר גודל של סמרטפון, זה קובע את הגודל לכל שאר הגדלים, אלא אם הוגדר אחרת.
הכלל הוא, כל מה שנקבע במסך קטן יותר, קובע כלפי מעלה, עד שהוגדר משהו יותר קרוב לגודל הגדול.
על מנת לקבוע רווחים יש להוסיף לדיב הראשי
class="container"
מאפייני css חדשים כגון:
display: flex;
גורם לבן להתגמש במקום שנקבע לדיב האבא
flex-wrap: wrap;
גורם לבן להימתח לפי גודלו האמיתי
justify-content: center; גורם למירכוז הקוביות לאמצע