6 فریم ورک محبوب css در سال 2019 کدامند؟ در این مقاله قصد داریم به معرفی 6 فریم ورک css محبوب در بین برنامه نویسان در سال 2019 بپردازیم و ویژگی های آنها را عنوان کنیم تا برای استفاده در پروژه های خوب تصمیم بهتری را بگیرید.
مطالعه کنید: آموزش جامع CSS , HTML
فریم ورکهای CSS در این مقاله شامل:
- Bulma
- Tailwind CSS
- Bootstrap 4
- Semantic UI
- Foundation
- Materialize CSS
فریم ورک Bulma
فریم ورک Bulma در جایگاه نخست این مقاله قرار دارد.بیشترین دلیل محبوبیت فریم ورک بولما عدم وجود کدهای جاوااسکریپت بوده و این فریم ورک تنها و تنها شامل کدهای خالص css است و به همین دلیل باعث سبک شدن و اجرای سریع پروژه ی شما در مرورگر میشود.ویژگی دیگر فریم ورک Bulma استفاده از ویژگی Flexbox در گریدبندی میباشد . در بوت استرپ نسخه های قبل از 4 این ویژگی وجود نداشت و از Float برای جایگیری Div ها استفاده میشد و در این زمان فریم ورک Bulma توانست رقیبی سخت برای بوت استرپ باشد.
ویژگی های فریم ورک Bulma :
- استفاده از ویژگی Flexbox
- کاملا سازگار با ریسپانسیو و موبایل
- بدون هیچگونه کدهای Javascript
- استفاده از ویژگی Sass
فریم ورک Tailwind CSS
فریم ورک Tailwind CSS یا تایلویند در رتبه دوم این مقایسه قراردارد.این فریم ورک بر خلاف فریم ورکهای دیگر بجای استفاده از کامپوننت ها بر روی کلاس های خاصی متمرکز شده است که میتوانید با ترکیب چند کلاس بر روی یک المان ، خاصیتهای دلخواه خود را اعمال نمایید.برای مثال در تکه کد زیر مشاهده میکنید که با استفاده از کلاسهای اختصاصی فریم ورک Tailwind CSS میتوانیم تغییرات زیادی در استایل یک دکمه ایجاد کنیم
<button class="bg-blue hover:bg-blue-dark text-white font-bold py-2 px-4 rounded">
دکمه طراحی شده با Tailwind CSS
</button>فریم ورک Bootstrap 4
با اینکه فریم ورک Bootstrap 4 یا همان بوت استرپ نسخه ی 4 در جایگاه سوم قرار دارد ، اما میتوان گفت که پر استفاده ترین فریم ورک کنونی در دنیا میباشد و اکثر برنامه نویسان با کدهای آن آشنا هستند. در نسخه ی 4 بوت استرپ از ویژگی Flexbox به خوبی استفاده شده است.در نسخه ی 4 از رنگ بندی های جدید ، کلاس های کاربردی جدید ، flexbox و Sass رونمایی شده است و همین موارد باعث شد که این فریم ورک جایگاه خود را حفظ نمایید و از محبوبیت آن کاسته نشود.
ویژگی های فریم ورک Bootstrap :
- رنگ بندی های متنوع
- کلاسهای کاربردی جدید
- استفاده از قابلیت Flexbox
- استفاده از Sass و Less
فریم ورک Semantic UI
فریم ورک Semantic UI یا سمانتیک یو آی یکی از فریم ورکهای جذاب میباشد که ظاهری متفاوت به پروژه های شما خواهد داد چرا که دارای کامپوننت های بسیار زیادی به نسبت سایر فریم ورکهای CSS داراست و سازنده ی فریم Semantic UI بیشتر تمرکز خود را بر روی ظاهر متفاوت و خاص این فریم ورک گذاشته است و نتیجه ی کار بسیار دیدنی است.اما با این ویژگی های خوب میتوان گفت که به نسبت سایر فریم ورکهای CSS کمی سنگین تر میباشد و سرعت بارگزاری سایت شما را کندتر خواهد کرد.یکی دیگر از ویژگی های فریم ورک Semantic UI همانطور که از نامش پیداست خصوصیت معنا گرایی آن است یعنی دستورات و کدهایی که استفاده میکنید با بسیار ساده و در عین حال با معنی قابل درک توسط انسان است که به آن اصطلاحا human-friendly HTML گفته میشود.
فریم ورک Foundation
فریم ورک Foundation یا فاندیشن طبق گفته ی طراحان آن مختص حرفه ای هاست و تمام ویژگی هایی که تا کنون در خصوص فریم ورکها شرح داده شده است مانند قابلیت ریسپانسیو ، Flexbox و ... در این فریم ورک وجود دارد.فریم ورک Foundation دارای تمپلیت های استارتر یا آماده میباشد که برای طراحی قسمت های مختلف سایت مانند لیست ایمیل و غیره میتوان استفاده کرد.
فریم ورک Materialize CSS
اگر مایل به طراحی استایل پروژه های خود با ظاهری مشابه با متریال دیزاین گوگل دارید ، از فریم ورک Materialize CSS میتوانید استفاده کنید.این فریم ورک استایلی مشابه با متریال دیزاین گوگل را به شما هدیه میدهد! این فریم ورک توسط 4 دانشجو طراحی شده است.
مطالعه کنید: 10 فریم ورک محبوب و برتر PHP در سال 2019