دوره CSS for Innovation Skills Development همراه با فلش‌کارت آموزشی — ارائه روی فلش مموری

🎓 دوره آموزشی جامع

📚 اطلاعات دوره

عنوان دوره: دوره CSS for Innovation Skills Development

موضوع کلی: برنامه نویسی

موضوع میانی: CSS

📋 سرفصل‌های دوره

• 1. مقدمه‌ای بر CSS و کاربرد آن
• 2. تاریخچه CSS
• 3. چرا CSS مهم است؟
• 4. CSS چیست و چگونه کار می‌کند؟
• 5. مرورگرها و موتورهای رندر CSS
• 6. تنظیم محیط توسعه CSS
• 7. ابزارهای توسعه‌دهنده مرورگر (Developer Tools)
• 8. نوشتن اولین قوانین CSS
• 9. انتخابگرهای CSS (Selectors) - بخش اول: انواع پایه
• 10. انتخابگرهای CSS - بخش دوم: انتخابگرهای کلاس و ID
• 11. انتخابگرهای CSS - بخش سوم: انتخابگرهای صفات (Attribute Selectors)
• 12. انتخابگرهای CSS - بخش چهارم: انتخابگرهای ترکیبی (Combinators)
• 13. انتخابگرهای CSS - بخش پنجم: انتخابگرهای شبه‌کلاس (Pseudo-classes)
• 14. انتخابگرهای CSS - بخش ششم: انتخابگرهای شبه‌عنصر (Pseudo-elements)
• 15. اولویت و ارث‌بری (Specificity and Inheritance)
• 16. واحدها در CSS (Units) - بخش اول: واحدهای مطلق (Absolute Units)
• 17. واحدها در CSS - بخش دوم: واحدهای نسبی (Relative Units)
• 18. رنگ‌ها در CSS (Colors) - بخش اول: مقادیر نام‌گذاری شده
• 19. رنگ‌ها در CSS - بخش دوم: مقادیر هگزادسیمال (Hexadecimal)
• 20. رنگ‌ها در CSS - بخش سوم: مقادیر RGB و RGBA
• 21. رنگ‌ها در CSS - بخش چهارم: مقادیر HSL و HSLA
• 22. مدل جعبه‌ای (Box Model) - بخش اول: محتوا (Content)
• 23. مدل جعبه‌ای - بخش دوم: فاصله داخلی (Padding)
• 24. مدل جعبه‌ای - بخش سوم: حاشیه (Margin)
• 25. مدل جعبه‌ای - بخش چهارم: کادر (Border)
• 26. خاصیت `box-sizing` و کاربردهای آن
• 27. مدیریت فضا با `margin` و `padding`
• 28. ویژگی‌های فونت (Font Properties) - بخش اول: `font-family`
• 29. ویژگی‌های فونت - بخش دوم: `font-size`
• 30. ویژگی‌های فونت - بخش سوم: `font-weight`
• 31. ویژگی‌های فونت - بخش چهارم: `font-style`
• 32. ویژگی‌های فونت - بخش پنجم: `line-height`
• 33. ویژگی‌های فونت - بخش ششم: `text-decoration`
• 34. ویژگی‌های فونت - بخش هفتم: `text-transform`
• 35. ویژگی‌های فونت - بخش هشتم: `letter-spacing` و `word-spacing`
• 36. ویژگی‌های فونت - بخش نهم: `text-align`
• 37. ویژگی‌های فونت - بخش دهم: `vertical-align`
• 38. مدیریت فونت‌های وب (Web Fonts)
• 39. ویژگی‌های پس‌زمینه (Background Properties) - بخش اول: `background-color`
• 40. ویژگی‌های پس‌زمینه - بخش دوم: `background-image`
• 41. ویژگی‌های پس‌زمینه - بخش سوم: `background-repeat`
• 42. ویژگی‌های پس‌زمینه - بخش چهارم: `background-position`
• 43. ویژگی‌های پس‌زمینه - بخش پنجم: `background-size`
• 44. ویژگی‌های پس‌زمینه - بخش ششم: `background-attachment`
• 45. میانبر `background`
• 46. مدیریت مقادیر `display` - بخش اول: `inline` و `inline-block`
• 47. مدیریت مقادیر `display` - بخش دوم: `block`
• 48. مدیریت مقادیر `display` - بخش سوم: `none`
• 49. مدیریت مقادیر `display` - بخش چهارم: `flex` (مقدمه)
• 50. مدیریت مقادیر `display` - بخش پنجم: `grid` (مقدمه)
• 51. مفهوم شناوری (Floats) و کاربردهای آن
• 52. رفع مشکلات شناوری (Clearing Floats)
• 53. موقعیت‌دهی (Positioning) - بخش اول: `static` و `relative`
• 54. موقعیت‌دهی - بخش دوم: `absolute`
• 55. موقعیت‌دهی - بخش سوم: `fixed`
• 56. موقعیت‌دهی - بخش چهارم: `sticky`
• 57. خاصیت `z-index` و مدیریت لایه‌ها
• 58. ویژگی‌های `overflow`
• 59. استفاده از `transform` برای جابجایی، چرخش و مقیاس‌دهی
• 60. استفاده از `transition` برای انیمیشن‌های ساده
• 61. استفاده از `animation` برای انیمیشن‌های پیچیده‌تر
• 62. تگ `<style>` و فایل‌های CSS خارجی
• 63. نحوه اتصال فایل‌های CSS به HTML
• 64. اصول طراحی واکنش‌گرا (Responsive Design)
• 65. عرض viewport و واحدهای `vw` و `vh`
• 66. دستورالعمل `@media` (Media Queries) - بخش اول: اصول پایه
• 67. دستورالعمل `@media` - بخش دوم: اولویت‌بندی و شرایط
• 68. دستورالعمل `@media` - بخش سوم: تنظیمات مربوط به دستگاه‌ها
• 69. دستورالعمل `@media` - بخش چهارم: تنظیمات مربوط به پرینت
• 70. اصول Flexbox - بخش اول: مفاهیم پایه
• 71. اصول Flexbox - بخش دوم: `display: flex` و `flex-direction`
• 72. اصول Flexbox - بخش سوم: `justify-content`
• 73. اصول Flexbox - بخش چهارم: `align-items`
• 74. اصول Flexbox - بخش پنجم: `flex-wrap`
• 75. اصول Flexbox - بخش ششم: `align-content`
• 76. اصول Flexbox - بخش هفتم: `order`
• 77. اصول Flexbox - بخش هشتم: `flex-grow`، `flex-shrink`، `flex-basis`
• 78. اصول Flexbox - بخش نهم: `align-self`
• 79. اصول CSS Grid - بخش اول: مفاهیم پایه
• 80. اصول CSS Grid - بخش دوم: `display: grid`
• 81. اصول CSS Grid - بخش سوم: `grid-template-columns` و `grid-template-rows`
• 82. اصول CSS Grid - بخش چهارم: `grid-gap` (و `row-gap`, `column-gap`)
• 83. اصول CSS Grid - بخش پنجم: `grid-column` و `grid-row`
• 84. اصول CSS Grid - بخش ششم: `grid-area`
• 85. اصول CSS Grid - بخش هفتم: `justify-items`، `align-items`
• 86. اصول CSS Grid - بخش هشتم: `justify-content`، `align-content`
• 87. اصول CSS Grid - بخش نهم: `grid-template-areas`
• 88. مدیریت فرم‌ها با CSS - بخش اول: styling input ها
• 89. مدیریت فرم‌ها با CSS - بخش دوم: styling labels و buttons
• 90. CSS برای جداول (Tables)
• 91. CSS برای لیست‌ها (Lists)
• 92. استفاده از CSS برای ایجاد انیمیشن‌های پیشرفته‌تر
• 93. استفاده از CSS Variables (Custom Properties)
• 94. پیش‌پردازنده‌های CSS (CSS Preprocessors) - مقدمه
• 95. Sass/SCSS - بخش اول: متغیرها (Variables)
• 96. Sass/SCSS - بخش دوم: Nesting
• 97. Sass/SCSS - بخش سوم: Mixins
• 98. Sass/SCSS - بخش چهارم: Inheritance / Extend
• 99. Sass/SCSS - بخش پنجم: Partials and Imports
• 100. CSS Modules و رویکردهای مدرن