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

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

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

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

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

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

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

• 1. مقدمه به CSS برای پلتفرم‌های مدیریت ناوگان
• 2. CSS چیست و چرا برای داشبوردها مهم است
• 3. نحو CSS: قوانین، انتخاب‌گرها، اعلان‌ها
• 4. چگونه CSS را درج کنیم: استایل‌های داخلی، خارجی، و درون‌خطی
• 5. آشنایی با انتخاب‌گرهای CSS: نوع، کلاس، و ID
• 6. انتخاب‌گرهای عمومی و گروهی
• 7. نظرات در CSS برای خوانایی بهتر کد
• 8. رنگ‌ها در CSS: نام‌گذاری شده، Hex، RGB، RGBA
• 9. مدل‌های رنگ HSL و HSLA برای طراحی تم
• 10. رنگ‌ها و تصاویر پس‌زمینه برای داشبوردها
• 11. ویژگی‌های پس‌زمینه: تکرار، موقعیت، اندازه
• 12. مقدمه‌ای بر Box Model در CSS
• 13. درک Margin و کاربرد آن
• 14. ویژگی‌های Border: عرض، سبک، رنگ
• 15. Padding: ایجاد فاصله در اطراف محتوا
• 16. ویژگی `box-sizing` برای طرح‌بندی قابل پیش‌بینی
• 17. تنظیم Font Family و Font Fallbacks
• 18. اندازه‌های فونت: Pixels، EMs، REMs، Percentages
• 19. وزن فونت، استایل، و ارتفاع خط
• 20. تراز متن و تزئینات متن
• 21. تبدیل متن و فاصله بین حروف
• 22. مقدمه‌ای بر Display Property: Block, Inline, Inline-Block
• 23. تسلط بر ویژگی `display` برای عناصر UI
• 24. مقدمه‌ای بر موقعیت‌دهی CSS: Static، Relative
• 25. موقعیت‌دهی Absolute برای پوشش‌ها و نشان‌ها
• 26. موقعیت‌دهی Fixed برای نوارهای ناوبری و هدرها
• 27. موقعیت‌دهی Sticky برای جداول داده پیمایش‌پذیر
• 28. درک `z-index` برای لایه‌بندی عناصر
• 29. مقدمه‌ای بر Floats در CSS برای طرح‌بندی چند ستونی
• 30. پاکسازی Floats با ویژگی `clear` و Clearfix
• 31. مقدمه‌ای بر Flexbox: طرح‌بندی جعبه انعطاف‌پذیر
• 32. ویژگی‌های Flex Container: `flex-direction`، `flex-wrap`
• 33. تراز کردن محتوا با `justify-content`
• 34. تراز کردن آیتم‌ها با `align-items` و `align-content`
• 35. ویژگی‌های Flex Item: `flex-grow`, `flex-shrink`, `flex-basis`
• 36. مرتب‌سازی آیتم‌های Flex با ویژگی `order`
• 37. مقدمه‌ای بر CSS Grid: طرح‌بندی دو بعدی
• 38. ویژگی‌های Grid Container: `grid-template-columns`, `grid-template-rows`
• 39. مناطق قالب‌بندی Grid برای طرح‌بندی‌های نام‌گذاری شده
• 40. `grid-gap`: فاصله بین ردیف و ستون
• 41. قرار دادن آیتم‌های Grid با `grid-column`, `grid-row`
• 42. واحد `fr` و تابع `repeat()` در Grid
• 43. تراز کردن آیتم‌های Grid: `justify-items`, `align-items`
• 44. شبکه‌های تودرتو و Flexbox در داخل Grid
• 45. اصول طراحی واکنش‌گرا برای پلتفرم‌های ناوگان
• 46. مقدمه‌ای بر Media Queries
• 47. نقاط شکست برای اندازه‌های مختلف دستگاه (دسکتاپ، تبلت، موبایل)
• 48. Meta Tag `viewport` برای واکنش‌گرایی موبایل
• 49. استفاده از واحدهای نسبی (%, vw, vh) برای طرح‌بندی‌های روان
• 50. طراحی برای نمایشگرهای با تراکم بالا (رتینا)
• 51. شبه کلاس‌ها: `:hover`, `:active`, `:focus` برای عناصر تعاملی
• 52. استایل‌دهی لینک‌ها: `:link`, `:visited`
• 53. شبه کلاس‌های ساختاری: `:first-child`, `:last-child`, `:nth-child`
• 54. شبه عناصر: `::before` و `::after` برای آیکون‌ها/محتوای سفارشی
• 55. انتخاب‌گرهای ویژگی برای عناصر داده خاص (`[attribute="value"]`)
• 56. ترکیب‌کننده‌ها: انتخاب‌گرهای فرزند، نواده، همسایه مجاور، همسایه عمومی
• 57. انتقال‌های CSS: تغییرات حالت روان
• 58. ویژگی‌های انتقال: `duration`, `timing-function`, `delay`
• 59. ایجاد افکت‌های Hover پایه برای ویجت‌های داشبورد
• 60. تبدیل‌های CSS: `translate()`, `rotate()`, `scale()`, `skew()`
• 61. مقدمه‌ای بر انیمیشن‌های CSS با `@keyframes`
• 62. ویژگی‌های انیمیشن: `name`, `duration`, `iteration-count`, `direction`
• 63. انیمیشن‌سازی به‌روزرسانی‌های داده بلادرنگ (مانند هشدارهای چشمک‌زن)
• 64. ویژگی‌های `opacity` و `visibility` برای عناصر UI
• 65. نشانگرهای سفارشی برای عناصر نقشه تعاملی
• 66. Outlines و مدیریت فوکوس برای دسترسی‌پذیری
• 67. پوشش‌ها و مودال‌ها: استایل‌دهی و تعامل
• 68. استایل‌دهی عناصر فرم: ورودی‌ها، تکست‌اریاها، انتخاب‌ها
• 69. سفارشی‌سازی چک‌باکس‌ها و رادیو‌باتن‌ها
• 70. استایل‌دهی دکمه‌ها برای اقدامات و ناوبری
• 71. مقدمه‌ای بر Custom Properties (متغیرهای CSS)
• 72. استفاده از تابع `var()` برای طراحی تم داشبوردهای ناوگان
• 73. تابع `calc()` در CSS برای اندازه‌گیری پویا
• 74. فیلترهای CSS: `blur()`, `grayscale()`, `brightness()`
• 75. Object-Fit و Object-Position برای مدیریت تصاویر (مثلاً عکس‌های وسایل نقلیه)
• 76. استایل‌دهی منوهای ناوبری (نوار کناری، نوار بالا)
• 77. سفارشی‌سازی جداول داده: ردیف‌ها، ستون‌ها، هدرها
• 78. استایل‌دهی صفحات‌بندی و نشانگرهای مرتب‌سازی
• 79. طراحی کارت‌ها و ویجت‌ها برای داشبوردهای ناوگان
• 80. ادغام و استایل‌دهی فونت‌های آیکون (مثلاً Font Awesome برای انواع وسایل نقلیه)
• 81. استایل‌دهی آیکون‌های SVG برای گرافیک‌های مقیاس‌پذیر
• 82. سفارشی‌سازی نشانگرهای نقشه و پنجره‌های اطلاعاتی
• 83. طراحی کامپوننت‌های هشدار و اعلان
• 84. تجسم تغییرات وضعیت بلادرنگ (مثلاً حرکت وسیله نقلیه، کدگذاری رنگ وضعیت)
• 85. طراحی تم یک پلتفرم مدیریت ناوگان: حالت‌های روشن و تاریک
• 86. پیاده‌سازی یک سیستم طراحی سازگار با CSS
• 87. متدولوژی‌های CSS: مقدمه‌ای بر BEM (Block, Element, Modifier)
• 88. سازماندهی Style Sheet‌های بزرگ با BEM
• 89. مقدمه‌ای بر پیش‌پردازنده‌های CSS (مثلاً اصول SCSS/SASS)
• 90. متغیرها و Nesting در SCSS برای CSS قابل نگهداری
• 91. Mixins و Functions در SCSS برای استایل‌های قابل استفاده مجدد
• 92. CSS حیاتی و بهینه‌سازی عملکرد
• 93. کوچک‌سازی و بسته‌بندی CSS
• 94. اطمینان از دسترسی‌پذیری (A11y) در CSS: کنتراست رنگ
• 95. مدیریت فوکوس و ناوبری با صفحه‌کلید
• 96. جداول واکنش‌گرا و تجسم داده‌ها
• 97. ملاحظات سازگاری با مرورگرهای مختلف
• 98. اشکال‌زدایی مشکلات CSS در ابزارهای توسعه‌دهنده
• 99. بهترین روش‌ها برای CSS مقیاس‌پذیر در برنامه‌های سازمانی
• 100. روندهای آینده در CSS برای پلتفرم‌های مدیریت ناوگان