شبکه
گزینه های شبکه
ببینید که چگونه جنبه های شبکه Bootstrap سیستم در چندین دستگاه با یک جدول مفید کار می کند.
|
xs <576 پیکسل |
sm ≥576 پیکسل |
md ≥768 پیکسل |
lg ≥992 پیکسل |
xl ≥1200 پیکسل |
xxl ≥1400 پیکسل |
|
|---|---|---|---|---|---|---|
Container |
هیچکدام (خودکار) | 540 پیکسل | 720 پیکسل | 960 پیکسل | 1140 پیکسل | 1320 پیکسل |
| Class prefix | .col- | .col-sm- | .col-md- | .col-lg- | .col-xl- | .col-xxl- |
| # of columns | 12 | |||||
| Gutter width | 1.5 rem | |||||
| Custom gutters | بله | |||||
| Nestable | بله | |||||
| Column ordering | بله | |||||
مثال Sm Grid
ستون ها در 576 پیکسل فرو می ریزند
مثال Md Grid
ستون ها در 768 پیکسل فرو می ریزند
مثال Lg Grid
ستون ها در 992 پیکسل فرو می ریزند
مثال Xl Grid
ستون ها در 1200 پیکسل فرو می ریزند
مثال XXl Grid
ستون ها در 1400 پیکسل فرو می ریزند
مثال شبکه
استفاده از یک مجموعه .col-sm-* کلاس‌ها، می‌توانید یک سیستم شبکه‌ای پایه ایجاد کنید که قبل از اینکه در دستگاه‌های رومیزی (متوسط) افقی شود، روی دستگاه‌های کوچک بسیار انباشته شروع می‌شود.
آفست (Max-Auto)
با استفاده از ستون ها به سمت راست حرکت کنید.offset-md-* کلاس ها این کلاس ها حاشیه سمت چپ یک ستون را با * ستون افزایش می دهند. به عنوان مثال، .offset-md-4 moves .col-md-4 بیش از چهار ستون. با حرکت به flexbox در نسخه 4، می توانید از ابزارهای حاشیه مانند استفاده کنید.mr-auto به زور ستون های مرتبط از یکدیگر دور شوند.