فلش‌کارت‌های آموزشی CSS for Fleet Management Platforms

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

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

عنوان دوره: دوره CSS for Fleet Management Platforms

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

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

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

• 1. مقدمه‌ای بر CSS و نقش آن در طراحی وب
• 2. آشنایی با سینتکس CSS: انتخابگرها، خواص و مقادیر
• 3. نحوه افزودن CSS به صفحات وب: اینلاین، داخلی و خارجی
• 4. انتخابگرهای CSS: بر اساس نام تگ
• 5. انتخابگرهای CSS: بر اساس کلاس
• 6. انتخابگرهای CSS: بر اساس ID
• 7. انتخابگرهای CSS: انتخابگرهای عمومی (*)
• 8. انتخابگرهای CSS: انتخابگرهای ترکیبی (فرزند، همسایه و...)
• 9. انتخابگرهای CSS: انتخابگرهای ویژگی (Attribute Selectors)
• 10. انتخابگرهای CSS: انتخابگرهای شبه کلاس (Pseudo-classes)
• 11. انتخابگرهای CSS: انتخابگرهای شبه عنصر (Pseudo-elements)
• 12. رنگ‌ها در CSS: مدل‌های رنگی RGB، Hex، HSL
• 13. واحد‌های اندازه‌گیری در CSS: پیکسل، درصد، em، rem، viewport units
• 14. فونت‌ها در CSS: خانواده فونت، اندازه فونت، وزن فونت، سبک فونت
• 15. متن در CSS: رنگ متن، تراز متن، فاصله خطوط، فاصله حروف
• 16. پس‌زمینه در CSS: رنگ پس‌زمینه، تصویر پس‌زمینه، تکرار پس‌زمینه، موقعیت پس‌زمینه
• 17. حاشیه‌ها (Borders) در CSS: سبک حاشیه، رنگ حاشیه، عرض حاشیه
• 18. فاصله‌گذاری (Padding) در CSS: تنظیم فضای داخلی عناصر
• 19. حاشیه‌های بیرونی (Margins) در CSS: تنظیم فضای بیرونی عناصر
• 20. مدل جعبه‌ای (Box Model) در CSS: درک کامل ابعاد عناصر
• 21. نمایش عناصر (Display) در CSS: بلاک، اینلاین، اینلاین-بلاک، none
• 22. موقعیت‌دهی (Positioning) در CSS: استاتیک، نسبی، مطلق، ثابت، چسبنده
• 23. لایه بندی عناصر (Z-index) در CSS: کنترل ترتیب نمایش عناصر روی هم
• 24. Overflow در CSS: مدیریت محتوای سرریز شده
• 25. Float در CSS: شناور کردن عناصر
• 26. Clear در CSS: رفع شناوری
• 27. مفاهیم چیدمان Flexbox: محور اصلی و محور فرعی
• 28. ظرف فلکس (Flex Container): خواص display و flex-direction
• 29. آیتم‌های فلکس (Flex Items): خواص flex-grow, flex-shrink, flex-basis
• 30. تراز بندی در Flexbox: justify-content و align-items و align-self
• 31. مرتب‌سازی آیتم‌ها در Flexbox: order
• 32. مفاهیم چیدمان Grid: سطرها، ستون‌ها و گپ‌ها
• 33. ظرف گرید (Grid Container): خواص display و grid-template-columns و grid-template-rows
• 34. آیتم‌های گرید (Grid Items): خواص grid-column-start, grid-column-end, grid-row-start, grid-row-end
• 35. تراز بندی در Grid: justify-items, align-items, justify-content, align-content
• 36. نامگذاری خطوط و نواحی گرید (Grid Areas)
• 37. توابع repeat() و minmax() در Grid
• 38. رسپانسیو کردن طرح با Flexbox
• 39. رسپانسیو کردن طرح با Grid
• 40. پرسش‌های رسانه‌ای (Media Queries): اصول و نحوه استفاده
• 41. پرسش‌های رسانه‌ای: بر اساس عرض صفحه
• 42. پرسش‌های رسانه‌ای: بر اساس ارتفاع صفحه
• 43. پرسش‌های رسانه‌ای: بر اساس نوع دستگاه
• 44. مفاهیم طراحی واکنش‌گرا (Responsive Design)
• 45. طراحی موبایل اول (Mobile-First Design)
• 46. استفاده از فریم‌ورک‌های CSS: Bootstrap, Tailwind CSS
• 47. Bootstrap: سیستم گرید
• 48. Bootstrap: کامپوننت‌ها (دکمه‌ها، فرم‌ها، نوبار و...)
• 49. Tailwind CSS: کلاس‌های utility-first
• 50. سفارشی‌سازی فریم‌ورک‌های CSS
• 51. انیمیشن‌ها در CSS: انتقال‌ها (Transitions)
• 52. انیمیشن‌ها در CSS: انیمیشن‌های کلیدی (Keyframe Animations)
• 53. تبدیل‌ها (Transforms) در CSS: 2D Transforms
• 54. تبدیل‌ها (Transforms) در CSS: 3D Transforms
• 55. فیلترها در CSS: Blur, Brightness, Contrast و...
• 56. سایه‌ها در CSS: Box-shadow و Text-shadow
• 57. گرادینت‌ها در CSS: Linear Gradients
• 58. گرادینت‌ها در CSS: Radial Gradients
• 59. گرادینت‌ها در CSS: Conic Gradients
• 60. ماسک‌ها در CSS: Clip-path
• 61. حالت Hover و فعال (Active) در CSS
• 62. استفاده از متغیرها (CSS Variables/Custom Properties)
• 63. محاسبات ریاضی در CSS: calc()
• 64. سلسله مراتب اهمیت (Specificity) در CSS
• 65. ارث‌بری (Inheritance) در CSS
• 66. Reset CSS و Normalize.css
• 67. CSS Modules: حل مشکل تداخل نام کلاس‌ها
• 68. CSS preprocessors: Sass, Less, Stylus
• 69. Sass: متغیرها و Data Types
• 70. Sass: توابع و Mixins
• 71. Sass: دستورات کنترلی (if, else, for, while)
• 72. Sass: وراثت (Extend)
• 73. Less: متغیرها و Mixins
• 74. Stylus: سینتکس و قابلیت‌ها
• 75. پست‌پردازشگرهای CSS: PostCSS
• 76. Autoprefixer: افزودن پیشوندهای مرورگر
• 77. CSS Linting: بررسی کیفیت کد CSS
• 78. بهینه‌سازی CSS: فشرده‌سازی (Minification)
• 79. بهینه‌سازی CSS: ترکیب فایل‌ها
• 80. بهینه‌سازی CSS: حذف کدهای غیرضروری
• 81. Lazy Loading تصاویر در CSS
• 82. لودینگ فونت‌ها: Font Loading Strategies
• 83. کار با آیکون‌ها: Font Awesome, SVG Icons
• 84. دسترسی‌پذیری (Accessibility) در CSS: اصول و تکنیک‌ها
• 85. طراحی برای چاپ با CSS: Media Query 'print'
• 86. کار با SVG در CSS
• 87. شکل‌دهی به فرم‌ها با CSS
• 88. ایجاد جداول responsive با CSS
• 89. طراحی Navigation Menus با CSS
• 90. ساخت اسلایدرها (Sliders) با CSS
• 91. پیاده‌سازی Tabs با CSS
• 92. پیاده‌سازی آکاردئون (Accordion) با CSS
• 93. طراحی Loading Spinners با CSS
• 94. طراحی مود تاریک (Dark Mode) با CSS
• 95. ادغام CSS با JavaScript
• 96. معماری CSS: BEM (Block Element Modifier)
• 97. معماری CSS: OOCSS (Object-Oriented CSS)
• 98. تست CSS: Visual Regression Testing
• 99. استفاده از DevTools مرورگر برای اشکال‌زدایی CSS
• 100. نکات پیشرفته و بهترین روش‌ها در CSS