کتاب صوتی CSS for Fleet Management Market

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

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

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

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

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

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

• 1. نقش CSS در توسعه وب
• 2. اهمیت CSS در رابط‌های کاربری مدیریت ناوگان
• 3. کالبدشناسی یک قانون CSS (انتخاب‌گر، ویژگی، مقدار)
• 4. روش‌های افزودن CSS: داخلی، خارجی و درون‌خطی
• 5. کامنت‌گذاری در CSS
• 6. سینتکس و اصطلاحات پایه
• 7. آماده‌سازی محیط توسعه (ویرایشگر کد و مرورگر)
• 8. اتصال CSS به HTML: ساخت یک داشبورد ساده
• 9. معرفی ابزارهای توسعه‌دهنده مرورگر برای CSS
• 10. مفاهیم CSS Reset و Normalize.css
• 11. انتخاب‌گرهای پایه: تگ، کلاس و شناسه
• 12. گروه‌بندی انتخاب‌گرها
• 13. انتخاب‌گرهای ترکیبی (Descendant, Child, Sibling)
• 14. انتخاب‌گرهای ویژگی (Attribute Selectors)
• 15. شبه-کلاس‌ها (Pseudo-classes) مانند :hover و :focus
• 16. شبه-عناصر (Pseudo-elements) مانند ::before و ::after
• 17. مفهوم Specificity و نحوه محاسبه آن
• 18. وراثت (Inheritance) در CSS
• 19. کلمه کلیدی !important و زمان استفاده از آن
• 20. معرفی Box Model: محتوا، Padding، Border و Margin
• 21. ویژگی `box-sizing: border-box`
• 22. واحدهای اندازه‌گیری: px, em, rem, %
• 23. واحدهای Viewport: vh, vw, vmin, vmax
• 24. کنترل نمایش عناصر با ویژگی `display`
• 25. تفاوت `visibility: hidden` و `display: none`
• 26. کار با رنگ‌ها: `color` و `background-color`
• 27. فرمت‌های رنگ: HEX, RGB, RGBA, HSL, HSLA
• 28. کار با گرادیان‌ها (Gradients)
• 29. تصاویر پس‌زمینه (Background Images) و کنترل آن‌ها
• 30. ویژگی‌های اصلی فونت: `font-family`, `font-size`, `font-weight`
• 31. استایل‌های متن: `text-align`, `text-decoration`, `text-transform`
• 32. فاصله بین خطوط و حروف (`line-height`, `letter-spacing`)
• 33. استفاده از فونت‌های وب با `@font-face`
• 34. استایل‌دهی به لیست‌ها (Lists)
• 35. ایجاد سایه برای عناصر (`box-shadow`) و متن (`text-shadow`)
• 36. مقدمه‌ای بر مدل‌های چیدمان در CSS
• 37. کار با Float و مفهوم Clearfix
• 38. موقعیت‌دهی (Positioning): `static` و `relative`
• 39. موقعیت‌دهی (Positioning): `absolute` و `fixed`
• 40. موقعیت‌دهی (Positioning): `sticky`
• 41. لایه‌بندی عناصر با `z-index`
• 42. مقدمه‌ای بر Flexbox و اصطلاحات کلیدی آن
• 43. ویژگی‌های Flex Container: `display`, `flex-direction`, `flex-wrap`
• 44. ویژگی‌های Flex Container: `justify-content` و `align-items`
• 45. ویژگی‌های Flex Items: `order`, `flex-grow`, `flex-shrink`, `flex-basis`
• 46. ساخت سایدبار و هدر داشبورد با Flexbox
• 47. مقدمه‌ای بر CSS Grid و اصطلاحات کلیدی آن
• 48. تعریف ستون‌ها و ردیف‌ها در Grid
• 49. جایگذاری آیتم‌ها در Grid
• 50. ترکیب خانه‌ها و نام‌گذاری خطوط در Grid
• 51. طراحی گرید داده‌های وضعیت خودروها با CSS Grid
• 52. استایل‌دهی به لینک‌ها و حالت‌های مختلف آن
• 53. طراحی دکمه‌های عملیاتی در داشبورد (مانند "ارسال دستور")
• 54. استایل‌دهی پایه به فرم‌ها: `input`, `textarea`, `label`
• 55. استایل‌دهی پیشرفته فرم‌ها: چک‌باکس و دکمه رادیویی سفارشی
• 56. استایل‌دهی به منوهای کشویی (`select`)
• 57. استایل‌دهی وضعیت‌های اعتبارسنجی فرم (`:valid`, `:invalid`)
• 58. طراحی جداول داده برای گزارشات ناوگان
• 59. ایجاد سطرهای یک در میان رنگی در جداول با `:nth-child`
• 60. استایل‌دهی آیکون‌ها: فونت آیکون در برابر SVG
• 61. ساخت تولتیپ‌های (Tooltips) سفارشی با CSS
• 62. طراحی واکنش‌گرا (Responsive Web Design) چیست؟
• 63. متا تگ Viewport
• 64. آشنایی با Media Queries و Breakpoints
• 65. رویکرد Mobile-First در برابر Desktop-First
• 66. کار با تصاویر واکنش‌گرا (`srcset`, `<picture>`)
• 67. تایپوگرافی واکنش‌گرا با واحدهای نسبی و `clamp()`
• 68. واکنش‌گرا کردن منوی ناوبری اصلی داشبورد
• 69. واکنش‌گرا کردن جداول داده برای نمایش در موبایل
• 70. نمایش و پنهان‌سازی عناصر در اندازه‌های مختلف صفحه
• 71. تست واکنش‌گرایی با ابزارهای مرورگر
• 72. مقدمه‌ای بر Transition ها در CSS
• 73. ویژگی‌های Transition: `property`, `duration`, `timing-function`, `delay`
• 74. ایجاد افکت‌های Hover نرم برای عناصر تعاملی
• 75. مقدمه‌ای بر Animation ها با `@keyframes`
• 76. ویژگی‌های Animation: `name`, `duration`, `iteration-count`, etc.
• 77. ساخت انیمیشن لودینگ (Loading Spinner) برای بارگذاری داده‌ها
• 78. متحرک‌سازی آیکون خودرو روی نقشه
• 79. کار با `transform`: توابع `translate()`, `rotate()`, `scale()`
• 80. مفهوم `transform-origin`
• 81. مقدمه‌ای بر Transform های سه‌بعدی
• 82. متغیرها در CSS (Custom Properties)
• 83. تم‌بندی داشبورد با متغیرهای CSS (حالت روشن/تاریک)
• 84. استفاده از تابع `calc()` برای محاسبات پویا
• 85. استفاده از توابع `min()`, `max()`
• 86. مقدمه‌ای بر پیش‌پردازنده‌های CSS مانند Sass/SCSS
• 87. متغیرها و تودرتونویسی (Nesting) در Sass
• 88. استفاده از Mixin و Extend در Sass
• 89. معماری CSS: معرفی متدولوژی BEM
• 90. سازماندهی فایل‌های CSS در پروژه‌های بزرگ
• 91. آشنایی با مفهوم CSS-in-JS
• 92. استایل‌دهی عناصر نقشه: پاپ‌آپ‌ها و نشانگرها
• 93. طراحی تایم‌لاین (Timeline) برای تاریخچه حرکت خودرو
• 94. طراحی نشانگرهای وضعیت: آنلاین، آفلاین، در حال حرکت
• 95. طراحی کامپوننت‌های هشدار (Alert) و اعلان (Notification)
• 96. استایل‌دهی نوارهای پیشرفت برای سطح سوخت یا مسیر
• 97. بصری‌سازی داده: طراحی نمودارهای پایه با CSS
• 98. طراحی چیدمان صفحه "ردیابی زنده"
• 99. استایل‌دهی برای نسخه‌های چاپی گزارشات (`@media print`)
• 100. دسترسی‌پذیری (Accessibility) در داشبورد: کنتراست رنگ و وضعیت فوکوس