منو

آموزش بوت استرپ 4(قسمت مقدمه)

نیما عبداله زاده
نیما عبداله زاده
مدرس دوره های طراحی سایت
اطلاعات دوره

مدرس :

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

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

10 ساعت

شهریه دوره :

190000 تومان

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

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

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

قسمت مقدمه

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

دقیقه
DatoosTech img Course

قسمت اول

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

دقیقه
DatoosTech img Course

قسمت دوم

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

دقیقه
DatoosTech img Course

قسمت چهارم

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

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

مقدمه

معرفی فریم ورک BootStrap

Bootstrap چیست؟

بوت استرپ (Bootstrap) یکی از محبوب ترین فریم ورک های HTML و css و javascript است.

با استفاده از بوت استرپ می توانید سایت های واکنش گرا و پاسخ گرا به موبایل ایجاد نمایید.

datoostech/bootstrap

Bootstrap مجموعه ای از ابزارهای رایگان برای ایجاد صفحات وب و نرم افزارهای تحت وب است که شامل دستورات HTML، CSS و توابع جاوا اسکریپت جهت تولید و نمایش فرم ها، دکمه ها، تب ها، ستون ها و سایر المان های مورد نیاز طراحی وب می باشد.

datoostech/bootstrap

در اگوست سال 2011، توییتر Bootstrap را بصورت متن باز و رایگان به عنوان یک فریم ورک طراحی وب سایت در اختیار دیگران قرارداد و در فوریه 2012 به محبوب ترین پروژه در سایت Github تبدیل شده بود.

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

بوت استرپ 4 تحولی در ستون بندی صفحات !

نسخه جدید بوت استرپ 4 سال بعد از انتشار اولین نسخه آن معرفی شد. مهمترین تغییر در نسخه جدید را میتوان استفاده از Flex در ستون بندی ها دانست. در نسخه 2 بوت استرپ سایز بندی ستون ها براساس پیکسل انجام میشد که در نسخه 3 برای انعطاف پذیری بیشتر به درصد تغییر یافت. در نسل چهارم فریم ورک بوت استرپ نیز ستون بندی ها براساس درصد انجام میشود با این تفاوت که شما دیگر محدود به درصد هایی خاص نیستید.

استفاده از Flexbox در بوت استرپ 4 موجب شده است که شما بتوانید المان ها و ستون هایی طراحی کنید که ابعاد آنها براساس سایر محتوای موجود در صفحه تعیین شود. به عنوان مثال اگر 3 ستون در یک بخش باشد عرض هر کدام از آنها یک سوم فضا خواهد بود ولی اگر 4 ستون باشد به صورت اتوماتیک فضایی معادل یک چهارم را اشغال خواهند کرد.

به عبارت دیگر هر المان در یک بخش میتواند سهمی مساوی از فضا را در اختیار بگیرد. البته قابلیت های flex به همین جا ختم نمیشود و شما میتوانید سهم هر المان از فضا را مشخص کرده و فضای باقی مانده را بین سایر المان ها تقسیم کنید. همین تغییر به ظاهر ساده موجب میشود که هنگام طراحی وب سایت آزادی عمل بیشتری داشته باشیم و نحوه نمایش نسخه موبایل را متناسب با سایز صفحه پیش بینی کنیم.

bootStrap/datoosTech

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