آشنایی با Bootstrap

آشنایی با Bootstrap ، قطعا وب سایت هایی که نمای جذاب تری دارند کاربران بیشتری را ترغیب میکنند که وقت خود را در اختیار شان بگذارند. این یک نقطه قوت است که اکثر طراحان وب سایت به دنبال آن هستند و برای داشتن طراحی جذاب تر از انواع ابزار ها و فریم ورک ها استفاده میکنند تا نتیجه مطلوبی بگیرند یکی از محبوب ترین فریم ورک های بین دیزاینر ها, فریم ورک بوت استرپ میباشد به دلایل بسیاری که درادامه بیشتر به آنها خواهیم پرداخت.

آشنایی با Bootstrap

آشنایی با Bootstrap ، بوت استرپ مجموعه ابزار های open source برای طراحی و دیزاین صفحات وب با کدهای CSS, HTML ,JavaScript است. فریم ورک بوت استرپ به دلایلی چون ساده و قابل فهم بودن که باعث یادگیری سریعتر آن میشود محبوبیت بیشتری نسبت به فریم ورک های دیگر در میان توسعه دهندگان وب پیدا کرده.

سازندگان این فریم ورک Mark Otto  و Jacob Thornton میباشند که در سال ۲۰۱۱  به صورت متن باز توییتر بوت استرپ را در اختیار همه قرار دادند.

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

• پشتیبانی از تمامی مرورگر ها (safari, Mozilla Firefox, Opera ,Chrome , IE)

• ارائه انواع قابلیت ها به صورت کاملا رایگان
• در نظر داشتن طراحی و استایل صفحات وب در موبایل
• یادگیری آسان (تنها با داشتن دانش HTML, CSS به راحتی میتوانید بوت استرپ را استفاده کنید)
• پشتیبانی از طراحی responsive یا پاسخگو ! بوت استرپ قابل تنظیم در دسکتاپ , تبلت و موبایل بدون هیچ به هم ریختگی کامپوننت ها

به عبارتی میتوان گفت بوت استرپ علاوه بر بالا بردن سرعت برنامه نویسان در بدست آوردن خروجی مورد نظر, خلاقیت آنها را نیزبالاتر میبرد چون بوت استرپ قالب کلی ابزار را به شما میدهد و تنها کافی است با اعمال تغییرات جزئی در کدهای HTML  وCSS آن نتیجه ای متفاوت و قطعا جالب دریافت کنید و حتی میتوانید خود را در گیر پیچیدگی های کدنویسی نکرده و از ابزارهای زیبای از پیش ساخته شده آن استفاده کنید.

شما میتوانید به راحتی به وب سایت getBootstrap مراجعه کرده و از کامپوننت های رایگان آن استفاده کنید برای مثال  تکه کد HTML زیر شماره گزاری برای صفحات را انجام میدهد که با استفاده از آن میتوان بین صفحات حرکت کرد

<nav aria-label="..."> 
<ul class="pagination"> 
<li class="disabled"><a href="#" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a></li> 
<li class="active"><a href="#">1 <span class="sr-only">(current)</span></a></li> ...
</ul> 
</nav>

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

ساختار پکیج Bootstrap :

• چارچوب اصلی

ساختاری ساده با سیستم توری , استایل پیوند و پس زمینه

• CSS

ویژگی ها و تنظیمات CSS ,استایل اساسی مولفه های HTML از جمله جداول , دکمه ها,  آیکن های گرافیکی کوچک   و…

• اجزا

تعداد قابل توجهی از اجزا از پیش ساخته شده و قابل استفاده مجدد از جمله  iconography, dropdowns, navigation, alerts, pop-overs و بسیاری دیگر

• افزونه های جاوا اسکریپت

تعداد زیادی افزونه های جاوا اسکریپت