یادگیری Tailwind CSS از پایه : یادگیری با ساخت پروژه های واقعی

با استفاده از کلاسهای ابزار Tailwind CSS ، طرح های بسیار خوبی به نظر برسید

عنوان اصلی : Tailwind CSS From Scratch | Learn By Building Projects

سرفصل های دوره :

مقدمه:
پیوندهای پروژه
تنظیمات اصلی محیط
اصول پایه Tailwind - قسمت 1:
نمونه اول ابزار
کار با رنگ ها
کانتینر و فاصله
تایپوگرافی
عرض و ارتفاع
طرح و موقعیت
زمینه ها و سایه ها
مرزها و شعاع مرزی
فیلترها
اصول Tailwind - قسمت 2:
تعامل
کلاس های Breakpoint و نمایش داده شد
ستون ها
Flexbox
شبکه
انتقال و تبدیل
کلاس های انیمیشن و کلید های کلید
پیکربندی و سفارشی سازی
حالت تاریک
یک محیط توسعه بهتر:
محیطی با Tailwind CLI ایجاد کنید
دستورالعمل ها و توابع
اختیاری - وب و محیط POSTCS
mini-projects css tailwind:
مینی پروژه 1 - کارت مشترک ایمیل
مینی پروژه 2 - شبکه های قیمت گذاری
مینی پروژه 3 - معین محصول
مینی پروژه 4 - گالری تصویر
مینی پروژه 5 - مودال ورود به سیستم
پروژه 1 - وب سایت کلیپ بورد:
تنظیم و پیکربندی
بخش قهرمان و تصویر پس زمینه
4 - بخش قطعه ها و استفاده از دستورالعمل ها
بخش و موارد ویژگی
بخش فوق العاده
منابع و پاورقی
مستقر در NetLify
پروژه 2 - وب سایت LoopStudios:
تنظیم و پیکربندی
قهرمان با ناوبری دسک تاپ
بخش ویژگی
بخش خلاقیت ها با پوشش شیب
پاورقی
دکمه و انیمیشن همبرگر
منوی موبایل و جاوا اسکریپت
استقرار به Vercel
پروژه 3 - به زودی وب سایت:
تنظیم و پیکربندی
NAVBAR
بخش قهرمان
فرم و پیوندها را کوتاه کنید
اعتبار سنجی پیوند جاوا اسکریپت
جعبه های ویژگی
CTA و پاورقی
منوی موبایل
پروژه 4 - پروژه شهادت:
تنظیم و پیکربندی
جعبه اول
جعبه های باقی مانده
کلاس های شبکه را اضافه کنید
افزونه گیره خط
پروژه 5 - وب سایت FYLO با انتخاب رنگ:
معرفی پروژه
تنظیم و پیکربندی
دکمه هدر و حالت تاریک
JavaScript برای حالت رنگ
بخش قهرمان
ویژگی ها و بخش های تولیدی
توصیفات و دسترسی زودهنگام
پیمایش و پاورقی صاف
پروژه 6 - وب سایت مدیر نشانک:
معرفی پروژه
تنظیم و پیکربندی
NAVBAR
بخش قهرمان
زبانه ها و چیدمان پانل
JavaScript برای زبانه ها
جعبه های بارگیری
آکاردئون متداول
خبرنامه و پاورقی
منوی موبایل