دوره CSS for Fleet Management Organizations همراه با فلش‌کارت آموزشی — ارائه روی فلش مموری

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

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

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

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

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

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

• 1. مقدمه‌ای بر CSS و نقش آن در وب
• 2. نحوه اتصال CSS به HTML: داخلی، خارجی و درون‌خطی
• 3. آشنایی با سینتکس CSS: انتخابگر، خصوصیت و مقدار
• 4. کامنت‌گذاری در CSS
• 5. انتخابگرهای اصلی (Element, Class, ID)
• 6. انتخابگرهای ترکیبی (Descendant, Child, Sibling)
• 7. انتخابگرهای ویژگی (Attribute Selectors)
• 8. مفهوم وراثت (Inheritance) در CSS
• 9. آشنایی با Cascade و Specificity
• 10. واحدها در CSS: واحدهای مطلق (px, pt)
• 11. واحدها در CSS: واحدهای نسبی (em, rem, %, vh, vw)
• 12. کار با رنگ‌ها: نام رنگ، HEX، RGB و HSL
• 13. استایل‌دهی به پس‌زمینه (Background Color, Image, Position)
• 14. جعبه مدل CSS (Box Model): Content, Padding, Border, Margin
• 15. خصوصیت Border و استایل‌های مختلف آن
• 16. تنظیم ابعاد عناصر: Width و Height
• 17. خصوصیت display: block, inline, inline-block
• 18. مخفی کردن عناصر: display: none و visibility: hidden
• 19. استایل‌دهی به متون: Font Family, Size, Weight
• 20. ترازبندی و دکوراسیون متن (Text Align, Decoration)
• 21. استایل‌دهی به لیست‌ها (ul, ol)
• 22. استایل‌دهی به لینک‌ها و حالت‌های مختلف آن (:link, :visited, :hover, :active)
• 23. مفهوم دو-کلاس‌ها (Pseudo-classes)
• 24. مفهوم دو-المنت‌ها (Pseudo-elements ::before, ::after)
• 25. مقدمه‌ای بر Flexbox برای چیدمان
• 26. Flex Container و خصوصیات اصلی آن (flex-direction, justify-content)
• 27. تراز کردن آیتم‌ها در Flexbox (align-items, align-content)
• 28. انعطاف‌پذیری آیتم‌ها در Flexbox (flex-grow, flex-shrink, flex-basis)
• 29. مقدمه‌ای بر CSS Grid برای چیدمان‌های پیچیده
• 30. تعریف Grid Container و قالب‌بندی ستون‌ها و ردیف‌ها
• 31. قرار دادن آیتم‌ها در Grid
• 32. فاصله‌گذاری در Grid با Gap
• 33. موقعیت‌یابی (Positioning): static, relative, absolute
• 34. موقعیت‌یابی (Positioning): fixed و sticky
• 35. کنترل لایه‌ها با Z-Index
• 36. استفاده از Float و Clear (برای درک مفاهیم قدیمی)
• 37. طراحی فرم‌های ورود اطلاعات خودرو
• 38. استایل‌دهی به Input, Textarea و Select
• 39. استایل‌دهی به دکمه‌ها و فراخوان‌ها (Call-to-Action)
• 40. استایل‌دهی به وضعیت‌های فرم: :focus, :valid, :invalid
• 41. طراحی کارت‌های داشبورد (Dashboard Cards) برای نمایش KPI
• 42. استایل‌دهی به جداول داده (Data Tables)
• 43. ایجاد سطرهای شطرنجی (Zebra Striping) در جداول
• 44. استایل‌دهی به سربرگ (Header) جداول
• 45. ایجاد افکت Hover برای ردیف‌های جدول
• 46. طراحی جداول واکنش‌گرا برای نمایش در موبایل
• 47. ساخت هدر ثابت (Sticky Header) برای جداول طولانی
• 48. استایل‌دهی به المان‌های نقشه: پاپ‌آپ‌ها (InfoWindows)
• 49. سفارشی‌سازی نشانگرهای نقشه (Map Markers) با CSS
• 50. طراحی منوهای ناوبری اصلی (Main Navigation)
• 51. ساخت منوی کناری (Sidebar) برای داشبورد
• 52. طراحی منوی کناری جمع‌شونده (Collapsible Sidebar)
• 53. استایل‌دهی به مسیرهای راهنما (Breadcrumbs)
• 54. طراحی کامپوننت صفحه‌بندی (Pagination)
• 55. استایل‌دهی به هشدارهای بصری (Status Alerts: Success, Warning, Error)
• 56. طراحی نوارهای پیشرفت (Progress Bars)
• 57. استایل‌دهی به مودال‌ها (Modal Dialogs)
• 58. استایل‌دهی به تولتیپ‌ها (Tooltips)
• 59. استفاده از آیکون‌ها (Font Icons/SVG) در رابط کاربری
• 60. متغیرهای CSS (Custom Properties)
• 61. مقدمه‌ای بر تم‌سازی: ساخت تم روشن (Light Mode)
• 62. پیاده‌سازی تم تاریک (Dark Mode) با متغیرهای CSS
• 63. مفهوم طراحی واکنش‌گرا (Responsive Web Design)
• 64. کار با Media Queries
• 65. رویکرد Mobile-First در طراحی واکنش‌گرا
• 66. استفاده از تصاویر واکنش‌گرا
• 67. مقدمه‌ای بر انیمیشن با Transitions
• 68. کنترل زمان‌بندی انیمیشن (Timing Functions)
• 69. انیمیشن‌های پیچیده‌تر با Keyframes و Animation
• 70. تبدیل‌های دو بعدی (2D Transforms: translate, rotate, scale)
• 71. تبدیل‌های سه بعدی (3D Transforms)
• 72. افکت‌های فیلتر (Filter Effects: blur, grayscale)
• 73. ایجاد سایه برای جعبه‌ها (Box Shadow) و متون (Text Shadow)
• 74. گرد کردن گوشه‌ها با Border-Radius
• 75. استفاده از گرادینت‌های خطی و شعاعی (Gradients)
• 76. حالت‌های ترکیب (Blend Modes)
• 77. مفهوم Overflow و کنترل آن
• 78. کار با فونت‌های سفارشی (Web Fonts) با @font-face
• 79. بهینه‌سازی بارگذاری فونت‌ها
• 80. انتخابگرهای پیشرفته (:nth-child, :not)
• 81. استفاده از تابع ()calc برای محاسبات پویا
• 82. مفهوم معماری CSS و اهمیت آن
• 83. آشنایی با متدولوژی BEM برای نام‌گذاری کلاس‌ها
• 84. مقدمه‌ای بر پیش‌پردازنده‌های CSS مانند Sass/SCSS
• 85. کار با متغیرها در Sass
• 86. مفهوم Nesting در Sass
• 87. استفاده از Mixins برای کدهای قابل استفاده مجدد
• 88. توابع و عملگرها در Sass
• 89. تقسیم‌بندی فایل‌های CSS با @import
• 90. ملاحظات دسترسی‌پذیری (Accessibility) در CSS
• 91. طراحی استایل برای حالت Focus
• 92. استفاده از prefers-reduced-motion برای کاربران حساس
• 93. ایجاد استایل‌های قابل چاپ (Print Stylesheets) برای گزارشات
• 94. بهینه‌سازی عملکرد CSS
• 95. کاهش حجم فایل‌های CSS (Minification)
• 96. استراتژی‌های بارگذاری CSS
• 97. اشکال‌زدایی (Debugging) کدهای CSS
• 98. استفاده از ابزارهای توسعه‌دهنده مرورگر (Browser DevTools)
• 99. بررسی و بازرسی المان‌ها
• 100. آشنایی با CSS-in-JS (مفهوم کلی)