سلام ، خوش اومدی !
در این قسمت درباره گرید و آپشن های اون در بوتسترپ توضیح داده شدهآپشن های گرید
در حالی که از بوت استرپ بیشتر برای تعیین اندازه ها استفاده میشه برای نقاط شکست گرید و عرض کانتینر نیز استفاده میشه. دلیلش هم اینه که عرض نمایشگرها بر حسب پیکسل هست و با اندازه فونت تغییر نمی کنه. حالا در این جدول به طور کامل میبینید که سیستم Bootstrap grid بر روی نمایشگرهای مختلف به چه صورتی کار میکنه.
|
خیلی کوچک <576 پیکسل |
کوچک ≥576 پیکسل |
متوسط ≥768 پیکسل |
بزرک ≥992 پیکسل |
خیالی بزرگ ≥1200 پیکسل |
|
|---|---|---|---|---|---|
| حداکثر عرض کانتینر | None (auto) | 540 پیکسل | 720 پیکسل | 960 پیکسل | 1140 پیکسل |
| پیشوند کلاس | .col- |
.col-sm- |
.col-md- |
.col-lg- |
.col-xl- |
| تعداد ستونها | 12 | ||||
| عرض Gutter | 24 پیکسل (12 پیکسل در هر طرف یک ستون) | ||||
| Nestable | بله | ||||
| ستون سفارشی | بله | ||||
ستونهای گرید
با استفاده از یک مجموعه از کلاس های Grid ، میتونی یک سیستم Grid پیش فرض ایجاد کنی که قبل از اینکه در دسک تاپ (متوسط) افقی بشه ، روی موبایل ها و تبلت ها (محدوده کوچک تا خیلی کوچک) شروع به کار می کنه. ستون های Grid رو میتونی در هر قسمت قرار بدی
.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