ساحة تجربة شبكة Bootstrap
صمّم تخطيطات متجاوبة بشبكة Bootstrap 5.3 بصريًا وانسخ الفئات بدقة — row وcol والإزاحات والترتيب والفواصل والمحاذاة.
—
كل شيء يعمل في متصفحك — لا يتم رفع أي شيء.
تُطبَّق الفئات التي تحددها من نقطة التوقف هذه فما فوق. بدّل نقاط التوقف لإنشاء تخطيطات متجاوبة.
حول ساحة تجربة شبكة Bootstrap
ملعب Bootstrap Grid يبني تخطيطات صفوف وأعمدة متجاوبة باستخدام نظام شبكة Bootstrap 5.3 الحقيقي. أضف حتى 12 عموداً إلى صف، وانقر أي عمود لضبط عرضه وإزاحته وترتيبه، واضبط الفراغات والمحاذاة على الصف — تتحدث المعاينة والترميز المُولَّد مباشرة مع كل تغيير.
لأن شبكات Bootstrap مبنية أولاً للجوال، فإن مفتاح نقاط التوقف محوري: اضبط عموداً على col-6 عند الأساس وcol-md-4 عند md، وستكون قد بنيت النمط الكلاسيكي المتراص على الجوال والمتجاور ثلاثياً على سطح المكتب دون كتابة سطر كود واحد. تأخذ الإزاحات والترتيب وفئات الفراغات نفس بادئات الاستجابة.
الناتج هو HTML نظيف جاهز للنسخ واللصق — div للصف مع الأعمدة الفرعية والفئات التي ضبطتها بالضبط. انسخ المقتطف بأكمله أو فئات الصف فقط؛ كل شيء يعمل محلياً في متصفحك.
كيفية استخدام ساحة تجربة شبكة Bootstrap
- أضف أعمدة إلى الصف — حتى 12 — وانقر أحدها لتحديده.
- اضبط امتداد وإزاحة وترتيب العمود المحدَّد لنقطة التوقف الحالية.
- بدّل نقاط التوقف (من sm إلى xxl) لتحديد كيفية إعادة تدفق التخطيط على الشاشات الأكبر.
- اضبط فراغات الصف وفئات محاذاته.
- راجع المعاينة الحية، ثم انسخ HTML المُولَّد أو فئات الصف.