خانه / طراحی / معرفی و نصب بوت استرپBOOTSTRAP

معرفی و نصب بوت استرپBOOTSTRAP

بوت استرپ (bootstrap) چیست؟

بوت استرپ محبوب ترین فریم ورک جهت طراحی وبسایت های واکنش گرا (Responsive) می باشد

که توسط Mark Otto و Jacob Thornton برای Twitter ساخته شد  و در سال 2011 در github به

صورت OpenSource منتشر شد. بوت استرپ فریم ورک طراحی سمت کاربر یا Front-end است

که بر پایه HTML , CSS , JavaScript طراحی شده است.پس برای یادگیری بوت استرپ حتما

باید آشنایی لازم با این موارد را داشته باشید.

وب سایت های واکنشگرا

وبسایتهای واکنش گرا وبسایت هایی هستند که در دستگاه های مختلف مانند موبایل، کامپیوتر ، تبلت و …

به درستی نمایش داده می شوند. واکنش گرا بودن وبسایت یکی از امتیازات مهم در بهینه سازی سایت به

حساب می آید که موتورهای جستجویی چون گوگل نیز به آن توجه زیادی می کنند

قابلیت‌ها

از نسخه ۲٫۰، بوت‌استرپ از طراحی واکنش گرا (Responsive design) نیز پشتیبانی می‌کند. این بدان معنی

است که طراحی گرافیکی صفحات وب به طور داینامیک با خصوصیات دستگاه مورد استفاده (کامپیوتر، تبلت و

موبایل) تطبیق پیدا می‌کنند

ساختار و عملکرد

بوت‌استرپ ماژولار بوده و اساساً شامل مجموعه‌ای از برگه‌های سبک آبشاری LESS (یک پیش پردازنده CSS

برای توسعه آسانتر و سریعتر در وب) است که اجزاء گوناگون این بسته ابزار را پیاده‌سازی می‌کند. یک شیوه

نامه به نام bootstrap.less شیوه نامه‌های اجزاء را در خود جا داده است. توسعه دهندگان می‌توانند فایل بوت‌استرپ

را با انتخاب اجزایی که برای پروژه خود نیاز دارند بسازند. تنظیمات از طریق یک شیوه نامه مرکزی تا حد محدودی

قابل انجام هستند. تغییرات عمده تر بوسیله دستورهای LESS امکان‌پذیر است. استفاده از زبان شیوه نامه LESS

اجازه استفاده از متغیرها، توابع و عملگرها، انتخاب گره‌های تو در تو، و نیز mixins را می‌دهد. بوت‌استرپ با در نظر

گرفتن مرورگرهای امروزی طراحی شده است. در نتیجه با آخرین نسخه‌های مرورگرهای Chrome,

Firefox, Opera, Safari و Internet Explorer بدون مشکل کار می‌کند.

 

 

دانلود بوت استرپ :

برای دانلود فریم ورک بوت استرپ بایستی وارد وبسایت getbootstrap.com شده واقدام به دانلود آخرین

نسخه آن کنید. می توانید از لینک زیر استفاده کنید :

هنگامی که وارد لینک بالا شدید سه گزینه برای شما نمایش داده می شود که شما بایستی از اولین

گزینه که شامل فایل فشرده CSS و javascript بوت استرپ است اقدام به دریافت آن کنید.

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

در آینده با آن ها بیشتر آشنا می شویم.هنگامی که عملیات دانلود تمام شد فایل فشرده را از

حالت فشرده باز کنید . بعد از آن با ساختاری مانند ساختار زیر مواجه می شوید

در پوشه CSS فایل های مربوط به استایل های CSS، در پوشه JS فایل های جاوااسکریپت  و در پوشه Fonts

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

جی کوئری یا Jquery دارد. آخرین نسخه Jquery را از لینک زیر دانلود کنید و به پوشه JS اضافه کنید.همجنین

شما می توانید تمام فایل ها مورد نیاز را از طریق CDN به سند خود اضافه کنیداستفاده از CDN در ایران بنا

به دلایلی توصیه نمی شود ولی اگر مایل به استفاده به روش CDN هستید می توانید از طریق زیر اقدام کنید:

بسیار خب تا به اینجای کار تمام اقدامات لازم را انجام دادیم. حالا یک فایل HTML در ریشه ساخته و با

نام index.html ذخیره می کنیم و موارد لازم را به آن اضافه میکنیم. توجه داشته باشید که بوت استرپ

بر اساس آخرین نسخه HTML یعنی HTML5 ساخته شده است.

حالا سند  HTML را اجرا کرده تا hello world برای شما نمایش داده شود.

 

پاپ کده

درباره‌ی majidkingkm

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *