מגרש משחקים לרשת Bootstrap
בנו פריסות רספונסיביות עם רשת Bootstrap 5.3 באופן חזותי והעתיקו את המחלקות המדויקות — row, col, היסטים, סדר, מרווחים ויישור.
—
הכול פועל בדפדפן שלך — שום דבר לא מועלה.
המחלקות שתגדירו חלות מנקודת שבירה זו ומעלה. החליפו נקודות שבירה כדי לבנות פריסות רספונסיביות.
אודות מגרש משחקים לרשת Bootstrap
מגרש המשחקים של Bootstrap Grid בונה פריסות שורות-וטורים רספונסיביות עם מערכת הרשת האמיתית של Bootstrap 5.3. הוסיפו עד 12 טורים לשורה, לחצו על כל טור כדי להגדיר את רוחבו, ההיסט והסדר שלו, וכווננו מרווחים ויישור בשורה — התצוגה המקדימה והקוד שנוצר מתעדכנים בזמן אמת עם כל שינוי.
מכיוון שרשתות Bootstrap הן mobile-first, מחליף נקודות השבירה הוא מרכזי: הגדירו טור ל-col-6 בבסיס ול-col-md-4 ב-md, ובניתם את הדפוס הקלאסי של ערימה בנייד, שלושה זה לצד זה בדסקטופ, ללא כתיבת שורת קוד אחת. היסטים, סדר ומחלקות מרווח כולם מקבלים את אותן קידומות רספונסיביות.
הפלט הוא קוד HTML נקי להעתקה-הדבקה — div שורה עם ילדי הטור שלו ובדיוק המחלקות שהגדרתם. העתיקו את כל הקטע או רק את מחלקות השורה; הכול פועל מקומית בדפדפן שלכם.
כיצד להשתמש ב-מגרש משחקים לרשת Bootstrap
- הוסיפו טורים לשורה — עד 12 — ולחצו על אחד כדי לבחור בו.
- הגדירו את הטווח, ההיסט והסדר של הטור הנבחר עבור נקודת השבירה הנוכחית.
- החליפו נקודות שבירה (sm עד xxl) כדי להגדיר איך הפריסה זורמת מחדש במסכים גדולים יותר.
- כווננו את מרווחי השורה ואת מחלקות שירות היישור שלה.
- סקרו את התצוגה המקדימה החיה, ואז העתיקו את קוד ה-HTML שנוצר או את מחלקות השורה.