تفاوت بین بوت استرپ 4 و بوت استرپ 5
نویسنده : داود میرزایی
دوشنبه ۱۹ دی ۱۴۰۱ - ۱۰:۰۳ بازدیدها : 539
در این مقاله قصد داریم به مناسبت انتشار نسخه 5 بتا بوت استرپ نگاهی بیندازیم به تفاوت های اصلی بوت استرپ نسخه 4 و بوت استرپ نسخه 5
بوت استرپ چیست؟
یک چارچوب منبع باز که از اواخر سال 2011 برای طراحی وب سایت های واکنشگرا با رویکرد Mobile First طراحی شده است.
بوت استرپ کتابخانه ای از کد های آماده CSS , HTML , JS می باشد و برای طراحی Front-end استفاده می شود.
چرا بوت استرپ؟
- سریع و راحت
- واکنشگرا و مناسب برای تلفن های همراه
- رایگان است! در سایت www.getbootstap.com موجود است
- پشتیبانی از مرورگر های مختلف
بوت استرپ 5 آلفا در اواسط ژوئن 2020 ارائه شده است.
برخی از کلاسهای اضافه شده در این نسخه عبارتند از:
gx-*(classes control the horizontal/column gutter width)
gy-*(classes control the vertical/row gutter width)
g-*(classes control the horizontal & vertical gutter width)
rows-cols-auto
تفاوت بین بوت استرپ 4 و بوت استرپ 5 :
| Bootstrap 4 | Bootstrap 5 | |
|---|---|---|
| Gride System | دارای 5 صفحه بندی است(xs,sm,md,ld,xl) | دارای 6 صفحه بندی است(xs,sm,md,ld,xl,xxl) |
| Color | دارای رنگ های محدود است | رنگ های اضافی با پالت رنگ بهبود یافته اضافه شده است |
| Jquery | دارای Jquery و تمام افزونه های مرتبط است | Jquery حذف شده و با چند افزونه فعال به vanilla js تغییر می یابد |
| Internet Explorer | بوت استرپ 4 از IE10 و 11 پشتیبانی میکند | بوت استرپ 5 از IE10 و 11 پشتیبانی نمیکند |
| Form elements | دکمه های رادیویی و جعبه های چک در سیستم عامل و مرورگر های مختلف ظاهر متفاوتی دارند | چه سیستم عامل باشد و چه مرورگر ظاهر عناصر فرم تغییر نخواهد کرد |
| Utilities API | امکان تغییر ابزار های کمکی در بوت استرپ 4 نیست | بوت استرپ 5 به ما امکان تغییر و ایجاد ابزار مورد نظر را می دهد |
| Gutter | از .gutter با اندازه قلم در px استقاده میکنید | از .g* با اندازه قلم در rem استفاده میکنید |
| Vertical Classes | ستون ها میتوانند بصورت نسبی قرار بگیرند (Relative) | ستون ها را نمیتوان بصورت نسبی قرار داد |
| Bootstrap Icons | بوت استرپ 4 آیکون SVG خاص را ندارد | بوت استرپ 5 آیکون های SVG خاص خود را دارد |
| Jumbotron | پشتیبانی می کند | پشتیبانی نمی کند |
| Card deck | card deckبرای ایجاد مجموعه ای از کارت ها با عرض و ارتفاع برابر استفاده می شود | کلاس card deck حذف شد |
| Navbar | ویژگی inline-block را دارید و بصورت پیش فرض برای کلاس dropdown-menu-dark کشویی سفید نمایش می دهد | ویژگی inline-block حذف شده و برای کلاس dropdown-menu-dark بصورت پیش فرض منوی کشویی مشکی نمایش می دهد |
| Static Site Generator | در بوت استرپ 4 از نرم افزار Jekyll استفاده می کنید | در بوت استرپ 5 از نرم افزار Hugo استفاده می کنید |
