گزینههای شبکهبندی
در حالی که بوتاسترپ از واحدها برای تعریف بیشتر اندازهها استفاده میکند، از آنها برای نقاط شکست شبکه و عرضهای کانتینر استفاده میشود. این به این دلیل است که عرض نمای صفحه به پیکسل اندازهگیری میشود و با اندازه فونت تغییر نمیکند. در اینجا میتوانید نحوه عملکرد جنبههای سیستم شبکهبندی بوتاسترپ را در دستگاههای مختلف مشاهده کنید، همراه با جدول کاربردی.
|
بسیار کوچک <576px |
کوچک ≥576px |
متوسط ≥768px |
بزرگ ≥992px |
بسیار بزرگ ≥1200px |
|
|---|---|---|---|---|---|
| عرض حداکثر کانتینر | هیچکدام (خودکار) | 540px | 720px | 960px | 1140px |
| پیشوند کلاس | .col- |
.col-sm- |
.col-md- |
.col-lg- |
.col-xl- |
| تعداد ستونها | 12 | ||||
| عرض حاشیه | 24px (12px از هر طرف یک ستون) | ||||
| قابلیت لانهسازی | بله | ||||
| ترتیب ستونها | بله | ||||
ستون شبکه
با استفاده از یک مجموعه کلاسهای شبکه، میتوانید یک سیستم شبکه پیشفرض ایجاد کنید که ابتدا در دستگاههای موبایل و تبلت (محدوده بسیار کوچک تا کوچک) به صورت پشتهشده شروع شود و سپس در دستگاههای دسکتاپ (متوسط) به صورت افقی نمایش داده شود. ستونهای شبکه را میتوان در هر مکانی قرار داد.
.Col-lg-12
.Col-lg-11
.Col-lg-01
.Col-lg-10
.Col-lg-02
.Col-lg-09
.Col-lg-03
.Col-lg-08
.Col-lg-04
.Col-lg-07
.Col-lg-05
.Col-lg-06
.Col-lg-06
.Col-lg-05
.Col-lg-07
.Col-lg-04
.Col-lg-08
.Col-lg-03
.Col-lg-09
.Col-lg-02
.Col-lg-10
.Col-lg-01
.Col-lg-11