• پست الکترونیک
    • گفتگو کنید
    • نماد پر
    • ابزارک ها

    • شما 3 اعلان دارید 4

    • پردازش تحویل

      10 دقیقه ی قبل

    • سفارش کامل شد

      1 ساعت پیش

    • بلیط های تولید شده

      3 ساعت پیش

    • تحویل کامل

      6 ساعت پیش
    • عین چاوز

      لورم ایپسوم به سادگی ساختگی است...

      32 دقیقه پیش

    • اریکا هیوز

      لورم ایپسوم به سادگی ساختگی است...

      58 دقیقه پیش

    • کوری توماس

      لورم ایپسوم به سادگی ساختگی است...

      1 ساعت قبل

    • همه را ببین
جدید
ایمی والتر

اداره منابع انسانی

  • 19.8 هزار

    دنبال کننده

  • 2 سال

    تجربه

  • 95.2 هزار

    دنبال کرده

گرید

  1. صفحه اصلی
  2. پایه
  3. گرید
گزینه های شبکه
شبکه بوت استرپ امکان ساخت بلوک های انعطاف پذیر با ارتفاع برابر را به راحتی فراهم می کند

در حالی که Bootstrap از em یا rem برای تعریف اکثر اندازه pxها استفاده می کند، برای نقاط شکست شبکه و عرض کانتینر استفاده می شود. این به این دلیل است که عرض درگاه نمایش بر حسب پیکسل است و با اندازه فونت تغییر نمی کند .

بسیار کوچک
<576 پیکسل 		کوچک
≥576 پیکسل 		متوسط
≥768 پیکسل 		بزرگ
≥992 پیکسل 		بسیار بزرگ
≥1200 پیکسل
رفتار شبکه افقی در همه حال برای شروع جمع شد، افقی بالای نقاط شکست
حداکثر عرض ظرف هیچکدام (خودکار) 540 پیکسل 720 پیکسل 960 پیکسل 1140 پیکسل
پیشوند کلاس .col- .col-sm- .col-md- .col-lg- .col-xl-
# ستون 12
عرض ناودان 30 پیکسل (15 پیکسل در هر طرف یک ستون)
تودرتو آره
افست آره
ترتیب ستون آره
ستون شبکه

با استفاده از یک مجموعه واحد از .col-md-*کلاس‌های شبکه، می‌توانید یک سیستم شبکه اصلی ایجاد کنید که قبل از اینکه در دستگاه‌های رومیزی (متوسط) افقی شود، به صورت انباشته در دستگاه‌های تلفن همراه و دستگاه‌های تبلت (از محدوده بسیار کوچک تا کوچک) شروع می‌شود. ستون های شبکه را در هر کدام قرار دهید .row.

col-md-1
col-md-2
col-md-2
col-md-3
col-md-4
col-md-5
col-md-7
col-md-6
col-md-6
col-md-8
col-md-4
col-md-9
col-md-3
col-md-10
col-md-2
col-md-12
تنظیم یک عرض ستون

طرح‌بندی خودکار برای ستون‌های شبکه flexbox به این معنی است که می‌توانید عرض یک ستون را تنظیم کنید و اندازه ستون‌های خواهر و برادر را به‌طور خودکار در اطراف آن تغییر دهید. می‌توانید از کلاس‌های شبکه از پیش تعریف‌شده (مانند شکل زیر)، میکس‌های شبکه یا عرض‌های درون خطی استفاده کنید. توجه داشته باشید که ستون های دیگر بدون توجه به عرض ستون مرکزی، اندازه آنها تغییر می کند.

1 از 3
2 از 3 (عریض تر)
3 از 3
1 از 3
2 از 3 (عریض تر)
3 از 3
چیدمان عمودی

برای تراز عمودی و افقی ستون ها از ابزارهای تراز flexbox استفاده کنید.

یکی از سه ستون
یکی از سه ستون
یکی از سه ستون
یکی از سه ستون
یکی از سه ستون
یکی از سه ستون
یکی از سه ستون
یکی از سه ستون
یکی از سه ستون
یکی از سه ستون
یکی از سه ستون
یکی از سه ستون
تراز افقی

برای تراز عمودی و افقی ستون ها از ابزارهای تراز flexbox استفاده کنید.

یکی از دو ستون
یکی از دو ستون
یکی از دو ستون
یکی از دو ستون
یکی از دو ستون
یکی از دو ستون
یکی از دو ستون
یکی از دو ستون
یکی از دو ستون
یکی از دو ستون
ستون تودرتو

برای تراز عمودی و افقی ستون ها از ابزارهای تراز flexbox استفاده کنید.

سطح 1: .col-sm-9
سطح 2: .col-8 .col-sm-6
سطح 2: .col-4 .col-sm-6
سفارش

از .order-کلاس هایی برای کنترل نظم بصری محتوای خود استفاده کنید. این کلاس ها پاسخگو هستند، بنابراین می توانید orderنقطه شکست را تنظیم کنید (مثلاً .order-1.order-md-2). شامل پشتیبانی 1از 12تمام پنج لایه شبکه است.

اول، اما بدون نظم
دوم، اما آخرین
سوم، اما اول
اول، اما آخر
دوم، اما بدون نظم
سوم، اما اول
انحراف

.offset-md-*با استفاده از کلاس ها، ستون ها را به سمت راست حرکت دهید . این کلاس ها حاشیه سمت چپ یک ستون را با *ستون افزایش می دهند. به عنوان مثال، روی چهار ستون .offset-md-4حرکت می کند ..col-md-4

.col-md-4
.col-md-4 .offset-md-4
.col-md-3 .offset-md-3
.col-md-3 .offset-md-3
.col-md-6 .offset-md-3
col-sm-5 .col-md-6
col-sm-5 .offset-sm-2 .col-md-6 .offset-md-0
col-sm-6 .col-md-5 .col-lg-6
col-sm-6 .col-md-5 .offset-md-2 .col-lg-6 .offset-lg-0