Мы используем файлы cookie.
Продолжая использовать сайт, вы даете свое согласие на работу с этими файлами.

بوت‌استرپ (چارچوب انتهایی)

Подписчиков: 0, рейтинг: 0
بوت‌استرپ
Bootstrap logo.svg
نویسنده(های)
اصلی
توییتر
انتشار ابتدایی اوت ۲۰۱۱
انتشار پایدار
4.5.2
۶ اوت ۲۰۲۰ (۲۰۲۰-06}})
مخزن
نوشته‌شده با اچ‌تی‌ام‌ال، سی‌اس‌اس، LESS و جاوااسکریپت
سیستم‌عامل چندسکویی
حجم ۷۱٫۱ کیلوبایت (فشرده)
گونه قالب اچ‌تی‌ام‌ال و سی‌اس‌اس
پروانه اجازه‌نامه آپاچی نسخهٔ ۲
وبگاه

بوت‌استرپ مجموعه‌ای برای ساخت ظاهری وب سایت‌ها و برنامه‌های وب است.

و یکی از محبوبترین فریم ورکهای css میباشد که از شیوه گرید بندی برای چیدمان صفحات وب استفاده میکند.بوت‌استرپ شامل تمپلت‌های طراحی اچ‌تی‌ام‌ال و سی‌اس‌اس محور برای typography، فرمها، دکمه‌ها، نمودارها، اجزاء راهبری و دیگر اجزاء رابط کاربری و الحاقات اختیاری (JavaScript Extensions)، می‌باشد. بوت‌استرپ محبوب‌ترین پروژه در GitHub بایگانی‌شده در ۲ اوت ۲۰۱۲ توسط Wayback Machine است که توسط NASA و MSNBC و دیگر سایتهای مطرح استفاده شده است. با استفاده از اطلاعات رابط برنامه‌نویسی (API) در بوت استرپ می‌توان اجزاء واسط پیشرفته مانند scrollspy و تکمیل کننده خودکار کلمات (typeahead) را بدون نیاز به نوشتن حتی یک خط کد جاوا اسکریپت ایجاد نمود. بهترین نکته بوت استرپ این است که متن باز بوده و به صورت رایگان قابل دانلود و استفاده می‌باشد.

تاریخچه

بوت‌استرپ از دل یکی از پروژه‌های توئیتر، که برای توسعه آنالیز داخلی و ابزارهای مدیریت بود، بیرون آمد. در مقطعی از انجام پروژه از کتابخانه‌های مختلفی برای توسعه رابط کاربری استفاده شد، که منجر به عدم ثبات و زحمات زیاد برای نگهداری و توسعه شد. اولین گسترش پروژه تحت شرایط واقعی در زمان اولین Hackweek توییتر اتفاق افتاد. در آگوست سال2012 توییتر اولین نسخه بوت‌استرپ را به صورت متن‌باز منتشر کرد.

قابلیت‌ها

بوت‌استرپ پشتیبانی نسبتاً ناقصی از HTML 5 و CSS 3 دارد، اما با تمامی مرورگرهای عمده سازگار است. از نسخه ۲٫۰، بوت‌استرپ از طراحی واکنش گرا (Responsive design) نیز پشتیبانی می‌کند. این بدان معنی است که طراحی گرافیکی صفحات وب به طور داینامیک با خصوصیات دستگاه مورد استفاده (کامپیوتر، تبلت و موبایل) تطبیق پیدا می‌کنند.

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

بوت‌استرپ ماژولار بوده و اساساً شامل مجموعه‌ای از برگه‌های سبک آبشاری LESS (یک پیش پردازنده CSS برای توسعه آسانتر و سریعتر در وب) است که اجزاء گوناگون این بسته ابزار را پیاده‌سازی می‌کند. یک شیوه نامه به نام bootstrap.less شیوه نامه‌های اجزاء را در خود جا داده است. توسعه دهندگان می‌توانند فایل بوت‌استرپ را با انتخاب اجزایی که برای پروژه خود نیاز دارند بسازند. تنظیمات از طریق یک شیوه نامه مرکزی تا حد محدودی قابل انجام هستند. تغییرات عمده تر بوسیله دستورهای LESS امکان‌پذیر است. استفاده از زبان شیوه نامه LESS اجازه استفاده از متغیرها، توابع و عملگرها، انتخاب گره‌های تو در تو، و نیز mixins را می‌دهد. بوت‌استرپ با در نظر گرفتن مرورگرهای امروزی طراحی شده است. در نتیجه با آخرین نسخه‌های مرورگرهای Chrome, Firefox, Opera, Safari و Internet Explorer بدون مشکل کار می‌کند.

شروع کار با بوت‌استرپ

به دو روش می‌توانید بوت‌استرپ را در صفحه HTML خودتان اضافه نمایید: می‌توانید به سادگی کد زیر را در قسمت HEAD فایل HTML خود اضافه نمایید:

<link rel="stylesheet" href="/twitter-bootstrap/twitter-bootstrap-v2/docs/assets/css/bootstrap.css">

از آنجایی که بوت‌استرپ از LESS پشتیبانی می‌نماید می‌توانید فایل استایل و جاوااسکریپت LESS را مثل کد زیر به صفحه اضافه نمایید:

{{سخ}}
<link rel="stylesheet/less" href="/path/to/bootstrap.less">
<script src="/path/to/less.js"></script>

امکانات

سیستم GRID

با استفاده از بوت‌استرپ می‌توانید سیستم GRID را در صفحه پیاده نمایید. بوت‌استرپ به طور پیشفرض از GRID با ۱۲ ستون و عرض ۹۴۰ پیکسل استفاده می‌کند و انواع دیگر GRID را نیز پشتیبانی می‌کند.

طرح‌بندی

با بوت‌استرپ می‌توانید طرح‌بندی صفحه را به راحتی پیاده کرده و به آسانی قالب HTML سایت خود را پی ریزی نمایید.

ویژگی های کلیدی

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

typography

تیتر، پاراگراف، لیست و دیگر عناصر Inline را با استفاده از قابلیتهای Typography موجود در بوت‌استرپ بسازید و نگران یکدست نبودن و عدم استاندارد بودن سایز سایت خود نباشید.

دیگر قابلیتهای بوت‌استرپ

جداول، فرمها، ناوبری و صفحه بندی (Navigation & Pagination)، پیغامهای خطا و هشدار، پنجره‌های مُدال، باکسهای Tooltip از دیگر مواردی هستند که با استفاده از بوت‌استرپ به راحتی قابل پیاده‌سازی هستند.

روش های استفاده از بوت‌استرپ

میتوان از ۴ روش برای اضافه کردن فایل های بوت‌استرپ به وبسایت استفاده کرد. دو روش ابتدایی، ساده و عمومی بوده و دو روش نهایی نیازمند کمی تخصص در زمینه برنامه نویسی می‌باشند.

۱- استفاده از CDN بوت‌استرپ

این روش مناسب وضعیتی می‌باشد که فایل‌های بوت‌استرپ بر روی سرور ذخیره نشوند. در این روش با استفاده سی دی ان‌های معرفی شده از سمت بوت‌استرپ، فایل های سی اس اس و جاوا اسکریپت به پروژه خود اضافه می‌شوند.

۲- ذخیره فایل ها بر روی سرور

در روش ۲ این امکان وجود دارد تا ورژن مورد نیاز را از وبسایت رسمی بوت‌استرپ دانلود شود و به صورت دستی سی اس اس را در بخش سی اس اس پروژه، و فایل‌های جاوا اسکریپت به آدرس فایل های جاوا اسکریپت پروژه اضافه شوند.

۳- Customize یا سفارشی سازی کردن فایل

در دو روش ذکر شده در قسمت بالا، تقریبا راه های عمومی ذکر شده و تمام فایل های موجود، به صفحه وبسایت اضافه خواهند شد که این عمل باعث افزایش میزان حجم وبسایت می‌شود.

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

۴- استفاده از پکیج منیجر

روش چهار نیازمند برنامه نویسی حرفه ای می‌باشد. با استفاده از ابزار پکیج منیجر (Package Manager ) این امکان فراهم می‌آید تا تنها المان هایی به فایل بوت استرپ اضافه شوند که در وبسایت مورد استفاده قرار گرفته اند.

پیوند به بیرون


Новое сообщение