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

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

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

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

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

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

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

• 1. مقدمه‌ای بر CSS و نقش آن در وب
• 2. چرا CSS برای پلتفرم‌های نهادهای اعتباربخشی مدیریت ناوگان حیاتی است؟
• 3. آشنایی با سه روش افزودن CSS به HTML
• 4. سینتکس پایه CSS: انتخابگرها، خصوصیات و مقادیر
• 5. بررسی کامنت‌گذاری در کدهای CSS
• 6. انتخابگرهای اصلی: عنصر، کلاس و شناسه (ID)
• 7. انتخابگرهای ترکیبی (Combinator Selectors)
• 8. انتخابگرهای ویژگی (Attribute Selectors)
• 9. مفهوم وراثت (Inheritance) در CSS
• 10. اولویت و آبشاری بودن در CSS (Specificity and the Cascade)
• 11. واحد اندازه‌گیری مطلق: پیکسل (px)
• 12. واحدهای اندازه‌گیری نسبی: درصد (%)، em و rem
• 13. مفهوم Box Model: محتوا، Padding، Border، Margin
• 14. تنظیمات خصوصیت display: block, inline, inline-block
• 15. کار با خصوصیات width و height
• 16. خصوصیت box-sizing: content-box در مقابل border-box
• 17. رنگ‌ها در CSS: کلمات کلیدی، HEX، RGB و HSL
• 18. استایل‌دهی به پس‌زمینه: background-color
• 19. استفاده از تصاویر در پس‌زمینه: background-image
• 20. کنترل تکرار و موقعیت تصویر پس‌زمینه
• 21. استایل‌دهی به متون: color و text-align
• 22. تنظیم فونت: font-family و font-size
• 23. تنظیم ضخامت و استایل فونت: font-weight و font-style
• 24. فاصله‌گذاری بین حروف و کلمات
• 25. تراز عمودی متن (Vertical Alignment)
• 26. استایل‌دهی به لیست‌ها: list-style-type
• 27. استایل‌دهی به لینک‌ها و حالت‌های مختلف آن (Pseudo-classes)
• 28. شبه‌کلاس‌های :hover, :active, :focus
• 29. شبه‌کلاس‌های ساختاری: :first-child, :last-child, :nth-child
• 30. شبه‌عناصر (Pseudo-elements): ::before و ::after
• 31. استایل‌دهی به جداول: border, padding و aignment
• 32. ادغام سلول‌های جدول: border-collapse
• 33. موقعیت‌دهی (Positioning): static, relative, absolute
• 34. موقعیت‌دهی (Positioning): fixed و sticky
• 35. مفهوم Z-index و لایه‌بندی عناصر
• 36. کار با خصوصیت Float برای چیدمان‌های قدیمی
• 37. مفهوم Clearfix برای حل مشکلات Float
• 38. مقدمه‌ای بر Flexbox برای چیدمان‌های یک‌بعدی
• 39. مفهوم Flex Container و Flex Items
• 40. خصوصیات Flexbox برای کانتینر: flex-direction, flex-wrap
• 41. خصوصیات Flexbox برای کانتینر: justify-content, align-items, align-content
• 42. خصوصیات Flexbox برای آیتم‌ها: flex-grow, flex-shrink, flex-basis
• 43. ترتیب‌دهی آیتم‌ها در Flexbox با خصوصیت order
• 44. ایجاد چیدمان‌های واکنش‌گرا با Flexbox
• 45. مقدمه‌ای بر CSS Grid برای چیدمان‌های دوبعدی
• 46. تعریف ستون‌ها و ردیف‌ها با grid-template-columns و grid-template-rows
• 47. واحد fr در CSS Grid
• 48. ایجاد فاصله بین آیتم‌ها با gap
• 49. جایگذاری آیتم‌ها در Grid با grid-column و grid-row
• 50. نام‌گذاری خطوط و نواحی در Grid
• 51. تراز کردن آیتم‌ها در CSS Grid
• 52. طراحی واکنش‌گرا (Responsive Web Design) چیست؟
• 53. استفاده از Viewport Meta Tag
• 54. مقدمه‌ای بر Media Queries
• 55. استفاده از Breakpoints رایج برای دستگاه‌های مختلف
• 56. رویکرد Mobile-First در طراحی واکنش‌گرا
• 57. تصاویر واکنش‌گرا: استفاده از max-width
• 58. استفاده از واحدهای vw و vh برای طراحی واکنش‌گرا
• 59. استایل‌دهی به فرم‌های ورود اطلاعات
• 60. طراحی دکمه‌ها و استایل‌دهی به آن‌ها
• 61. استایل‌دهی به input, textarea و select
• 62. ایجاد انیمیشن با Transitions در CSS
• 63. کنترل زمان‌بندی و تاخیر در Transitions
• 64. انیمیشن‌های پیچیده‌تر با Keyframes و Animation
• 65. خصوصیات transform: scale, rotate, translate
• 66. ایجاد افکت‌های سه‌بعدی با 3D Transforms
• 67. فیلترهای CSS: grayscale, blur, sepia
• 68. استفاده از خصوصیت clip-path برای ایجاد اشکال سفارشی
• 69. خصوصیت object-fit برای کنترل تصاویر
• 70. متغیرهای CSS (Custom Properties) برای تم‌سازی پویا
• 71. محدوده (Scope) متغیرهای CSS
• 72. کار با توابع CSS: calc()
• 73. کار با توابع رنگی: rgba() و hsla() برای شفافیت
• 74. مفهوم پیش‌پردازنده‌های CSS مانند Sass/SCSS
• 75. سازماندهی فایل‌های CSS در پروژه‌های بزرگ
• 76. روش‌شناسی BEM برای نام‌گذاری کلاس‌ها
• 77. مقدمه‌ای بر CSS-in-JS
• 78. استفاده از فونت‌های سفارشی با @font-face
• 79. استفاده از آیکون‌های فونتی (مانند Font Awesome)
• 80. بهینه‌سازی کارایی CSS
• 81. کاهش حجم فایل‌های CSS (Minification)
• 82. مباحث دسترسی‌پذیری (Accessibility) در CSS
• 83. استایل‌دهی برای چاپ (Print Stylesheets)
• 84. حالت تاریک (Dark Mode) با استفاده از Media Queries
• 85. ایجاد Tooltip با CSS خالص
• 86. ساخت منوی ناوبری افقی و واکنش‌گرا
• 87. طراحی کامپوننت کارت (Card) برای نمایش اطلاعات خودرو
• 88. استایل‌دهی به جدول داده‌های وضعیت خودروها
• 89. طراحی نمودارهای میله‌ای ساده با CSS
• 90. استایل‌دهی به نشانگرهای وضعیت (Status Indicators)
• 91. طراحی فرم‌های ورود داده بازرسی (Inspection Forms)
• 92. ایجاد یک داشبورد پایه با CSS Grid
• 93. افزودن مدال (Modal) یا پاپ‌آپ با CSS و کمی جاوااسکریپت
• 94. طراحی یک سایدبار (Sidebar) ثابت یا تاشو
• 95. استایل‌دهی به اعلان‌ها (Notifications) و هشدارها (Alerts)
• 96. ایجاد افکت Parallax ساده
• 97. آشنایی با فریم‌ورک‌های CSS مانند Bootstrap (مفهوم و کاربرد)
• 98. آشنایی با Tailwind CSS (مفهوم و کاربرد)
• 99. عیب‌یابی (Debugging) کدهای CSS با ابزارهای مرورگر
• 100. بررسی نهایی و بهینه‌سازی CSS برای داشبورد مدیریت ناوگان