آموزش کامل CSS شامل CSS Grid و CSS Flexbox

در این دوره آموزشی قدم به قدم با CSS Grid و همچنین CSS Flexbox آشنا شده و مباحث مختلف آن ها را در پروژه های واقعی تجربه و تمرین خواهید کرد. 

عنوان اصلی : CSS Bootcamp: Master CSS (Including CSS Grid/Flexbox)

سرفصل ها :

خوش آمدی :
معرفی
برپایی
مبانی CSS:
CSS چیست؟
چگونه CSS بنویسیم؟
درخت عناصر HTML
انتخابگرهای CSS
CSS Combinators
رنگ های CSS
وراثت
قالب بندی متن - قسمت 1
قالب بندی متن - قسمت 2
مدل جعبه
کلاس های شبه - قسمت 1
کلاس های شبه - قسمت 2
عناصر شبه
واحدهای اندازه گیری - قسمت 1
واحدهای اندازه گیری - قسمت 2
موقعیت ها - قسمت 1
موقعیت ها - قسمت 2
سرریز
شناورها
CSS پیشرفته:
پس زمینه - قسمت 1
پس زمینه - قسمت 2
گرادیان ها
سایه ها
انتقال ها
تبدیل - قسمت 1
تبدیل - قسمت 2
انیمیشن ها - قسمت 1
انیمیشن ها - قسمت 2
فلکس باکس:
فلکس باکس چیست؟
خواص ظروف فلکس
ویژگی های اقلام فلکس
پروژه 1 - هتل بزرگ (بر اساس Flexbox):
هتل بزرگ - پیش نمایش پروژه
نوار کناری - نشانه گذاری
نوار کناری - سبک
ناوبری - نشانه گذاری
ناوبری - سبک - قسمت 1
ناوبری - سبک - قسمت 2
ایجاد رویداد کلیک
ایجاد نشانه گذاری برای سربرگ
سربرگ - سبک
بخش درباره ما - نشانه گذاری
بخش درباره ما - سبک - قسمت 1
بخش درباره ما - سبک - قسمت 2
بخش اتاق - نشانه گذاری
بخش اتاق - سبک
بخش مشتریان - نشانه گذاری
بخش مشتریان - سبک
پاورقی - نشانه گذاری
پاورقی - سبک
طراحی وب سایت ریسپانسیو:
پروژه "گرند هتل" را پاسخگو کنید - قسمت 1
پروژه "گرند هتل" را پاسخگو کنید - قسمت 2
پروژه "گرند هتل" را پاسخگو کنید - قسمت 3
شبکه CSS:
CSS Grid معرفی
برپایی
نحوه ایجاد گرید
واحدهای کسری
موقعیت یابی و پوشا اقلام شبکه
نامگذاری اقلام شبکه - قسمت 1
نامگذاری اقلام شبکه - قسمت 2
نامگذاری مناطق شبکه
شبکه صریح و ضمنی
تراز کردن آیتم های شبکه
تراز کردن مسیرهای شبکه
max-content، min-content، minmax()
پر کردن خودکار، تنظیم خودکار
پروژه 2 - فروشگاه مبلمان (بر اساس شبکه CSS):
فروشگاه مبلمان - پیش نمایش پروژه
Navbar - قسمت 1 - نشانه گذاری
نوار نوار - قسمت 1 - سبک
نوار ناوبری - فرم جستجو
نوار نوار - قسمت 2 - نشانه گذاری
نوار نوار - قسمت 2 - سبک
نوار نوار - قسمت 2 - کشویی
بنر - نشانه گذاری
بنر - سبک
نمایش اسلاید بنر - قسمت 1
نمایش اسلاید بنر - قسمت 2
بخش پیشنهاد روز
پرفروش ترین مبلمان - نشانه گذاری
پرفروش ترین مبلمان - سبک
گالری
بخش تماس و پاورقی
جعبه مدال - نشانه گذاری
جعبه مدال - سبک - قسمت 1
جعبه مدال - سبک - قسمت 2
پروژه را پاسخگو کنید