منو

سیستم گرید یا پایه (قسمت دوم)

توجه! برای مشاهده این قسمت از آموزش در این دوره ثبت نام نمایید
نیما عبداله زاده
نیما عبداله زاده
مدرس دوره های طراحی سایت
اطلاعات دوره

مدرس :

نیما عبداله زاده

مدت زمان تقریبی:

10 ساعت

شهریه دوره :

190000 تومان

شرکت در این دوره :

🎓 دریافت گواهینامه پس از پایان دوره و شرکت در آزمون آنلاین

لیست جلسات
DatoosTech img Course

قسمت مقدمه

آموزش بوت استرپ 4

دقیقه
DatoosTech img Course

قسمت اول

پیاده سازی فریم ورک بوت استرپ در پروژه

دقیقه
DatoosTech img Course

قسمت دوم

سیستم گرید یا پایه

دقیقه
DatoosTech img Course

قسمت چهارم

تایپوگرافی / رنگ ها

دقیقه
مطالب این جلسه

قسمت دوم

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

بوت استرپ یک سیستم گریدبندی 12 ستونی را برای صفحات خود در نظر گرفته است، یعنی شما صفحه ای با 12 ستون در اختیار خواهید داشت که مطابق با نیاز و محتواتون میتوانید از این گریدها استفاده کنید. در صورتی که شما نمیخواهید از همه این 12 ستون استفاده کنید میتوانید تقسیم بندی خود را به گونه ای انجام دهید که ستون های پهن تری داشته باشید و مثلا به جای 12 ستون 3 ستون داشته باشید ، منتها باید توجه داشته باشید که مجموع ستون ها باید 12 شود .

grid/bootstrap/datoosTech

همانطور که در بالا ملاحظه میکنید ، ردیف اول دارای 12 ستون کوچک، ردیف دوم دارای 3 ستون پهن تر است که هر کدام از این ستون ها خود دارای عرضی به اندازه 4 ستون هستند، ردیف سوم داری دو ستون 4 و 8 تایی، ردیف چهارم دو ستون هم اندازه 6 تایی و ردیف پنجم یک ستون پهن به عرض همه 12 ستون دارد

سیستم بوت استرپ ریسپانسیو است و بسته به سایز صفحه نمایش میتواند تغییر کند

کلاس های گریدبندی در بوت استرپ:

  • سیستم گرید بوت استرپ دارای 4 کلاس می باشد:
    • کلاس xs : صفحات نمایش بسیار کوچک یا xs، مانند موبایل‌ها (کمتر از 768 پیکسل)
    • کلاس sm: صفحات نمایش کوچک یا sm مانند تبلت‌ها (بیشتر از 768 پیکسل و کمتر از 992 پیکسل)
    • کلاس md: صفحات نمایش با اندازه متوسط یاmd مانند سیستم‌های دسکتاپ (بیشتر از 992 پیکسل و کمتر از 1200 پیکسل)
    • کلاس lg: صفحات نمایش با اندازه بزرگ یاlg مانند سیستم‌های خاص دسکتاپ (بیشتر از 1200 پیکسل)

بوت استرپ کاملا رایگان است و می توانید آن را دانلود کرده و استفاده کنید. هم اکنون یادگیری بوت استرپ را از وب سایت داتوس تک آغاز نمایید!