CSS

آشنایی با امکانات جدید Bootstrap 4

تبلیغات
کانال تلگرام فتولیا
4 سوالی شهرداری

فریم ورک سی اس اس Bootstrap 4 بعد از یک سال تلاش بی وقفه توسط تیم آن آماده شده است و می توانیم نسخه آلفایش را تست کنیم.

چیز جدید چی داره ؟

bs4-alphaتغییرات بسیار زیاد و بزرگی در این نسخه بوت استرپ داده شده است و پرداختن به همه آنها در این مطلب ممکن نیست ولی تغییراتی را که توسط تیم بوت استرپ بیان شده است با هم مرور می کنیم:

  • اسباب کشی از LESS به SASS. بوت استرپ حالا سریع تر از هر زمان دیگری کامپایل می شود و این را مدیون LibSass است.پس بوت استرپ نیز به جامعه بزرگ SASS پیوست!
  • سیستم Grid بهبودیافته. در این نسخه امکانات جدیدی برای نشانه گرفتن بهتر دستگاه های موبایل فراهم شده است و تمام Mixin های مربوطه بازرسی و بهبود یافته اند.
  • پشتیبانی توکار از Flexbox. آینده همین حالاست! کافی است یک مقدار بولین را عوض کرده و CSS را دوباره کامپایل کنید تا از مزایای یک سیستم Grid بندی و همچنین اجزای صفحه بر پایه Flexbox بهره مند شوید!
  • card به جای well, panel و thumbnails. بخش card یک از اجزای جدید bootstrap 4 است ولی کارکردی شبیه به well, panel و thumbnails و بهتر از آنها دارد.
  • تثبیت تمام HTML Reset ها داخل یک ماژول جدید بنام Reboot. این ماژول جدید یک فایل Sass است که همه کارایی های normalize.css را در خود دارد.
  • امکانات سفارشی سازی جدید. به جای اینکه کدهای تزئیناتی مثل gradient ها، transition ها، سایه ها و … مانند نسخه ۳ در یک فایل جداگانه قرار داده شوند، در یک متغیر Sass قرار داده شده اند.می خواهید یک transition پیش فرض را به همه اجزای صفحه اعمال کنید و یا همه گوشه های گرد اجزای صفحه را از یکجا حذف کنید؟ حالا کافیست یک متغیر را تغییر داده و ریکامپایل کنید!
  • توقف پشتیبانی از IE8 و استفاده از واحد های em و rem. توقف پیشیبانی از IE8 به این معنی است که بوت استرپ ۴ می تواند از جدیدترین و بهترین بخش های css بهره ببرد بدون آنکه درگیر استفاده از انواع هک های css شود. خوشبختانه پیکسل نیز با em و rem جا به جا شده است تا پشتیبانی از تایپوگرافی Responsive و سایزبندی اجزای مختلف صفحه آسان تر و بهتر شود. اگر شما به پشتیبانی از IE8 نیاز دارید از Bootstrap 3 استفاده کنید.
  • همه پلاگین های JavaScript در Bootstrap دوباره نوشته شده اند. هر پلاگین در ES6 بازنویسی شده است تا از جدیدترین پیشرفت های جاوا اسکریپت بهره مند شود. به علاوه حالا از UMD، متدهای عمومی کالبدشکافی کد و کلی امکانات دیگر بهره مند هستند.
  • بهبود یافتن مکان قرارگیری خودکار tooltip و popover. با تشکر از کمک ابزاری بنام Tether.
  • همه مستندات بازنویسی شده اند. همه آن به Markdown بازنویسی شده است و از تعدادی پلاگین جهت نمایش بهتر کد ها و اجزای زنده نمونه کدها استفاده است.همچنین قرار است جستجو در این مستندات نیز آسان تر شود.
  • و کلی امکانات دیگر …! فیلد های سفارشی فرم، کلاس های مربوط به padding و margin، کلاس های کمکی تازه و ابزارهای بسیار دیگری در این نسخه اضافه شده اند که حتما از آنها خوشتان خواهد آمد.

پشتیبانی از BootStrap 3

وقتی نسخه ۳ بوت استرپ عرضه شد ناگهان پشتیبانی از نسخه ۲ قطع شد ولی از این به بعد به این شکل نخواهد بود.تیم Bootstrap قطع پشتیبانی از Bootstrap2 را یک اشتباه دانسته و قول داده تا در مورد نسخه ۳ این اشتباه را تکرار نکند پس با خیال به استفاده از نسخه سوم آن ادامه دهید تا ورژن نهایی بوت استرپ ۴ عرضه شود تا از امکانات جذاب آن بهره مند شویم.

 

برای مشاهده مستندان نسخه ۴ می توانید به اینجا سری بزنید.

منبع

One Comment

پاسخ دهید

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