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

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

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

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

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

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

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

• 1. مقدمه‌ای بر CSS و نقش آن در پلتفرم‌های مدیریت ناوگان
• 2. چرا CSS برای داشبوردهای داده‌محور حیاتی است؟
• 3. آشنایی با سه روش افزودن CSS به HTML: Inline, Internal, External
• 4. بررسی ساختار یک قانون CSS: انتخابگر، خصوصیت و مقدار
• 5. اولین استایل‌دهی: تغییر رنگ متن و پس‌زمینه
• 6. کار با انتخابگرهای پایه: تگ، کلاس و شناسه (ID)
• 7. گروه‌بندی انتخابگرها برای اعمال استایل یکسان
• 8. مفهوم وراثت (Inheritance) در CSS
• 9. کامنت‌گذاری در کدهای CSS برای خوانایی بهتر
• 10. مدل جعبه‌ای (Box Model): محتوا، Padding, Border, Margin
• 11. تنظیم ابعاد عناصر: خصوصیات width و height
• 12. خصوصیت box-sizing و تفاوت border-box با content-box
• 13. کار با خصوصیت Padding برای ایجاد فضای داخلی
• 14. کار با خصوصیت Margin برای ایجاد فاصله خارجی
• 15. استایل‌دهی به حاشیه‌ها (Borders): ضخامت، نوع و رنگ
• 16. مفهوم Specificity و اولویت در اعمال استایل‌ها
• 17. استفاده از کلمه کلیدی !important و خطرات آن
• 18. واحد‌های اندازه‌گیری مطلق: پیکسل (px)
• 19. واحدهای اندازه‌گیری نسبی: درصد (%)، em و rem
• 20. واحدهای اندازه‌گیری Viewport: vh, vw, vmin, vmax
• 21. استایل‌دهی به متون: font-family و font-size
• 22. تنظیم ضخامت و استایل فونت: font-weight و font-style
• 23. تراز کردن متن: خصوصیت text-align
• 24. تزئین متن: خصوصیت text-decoration
• 25. فاصله‌گذاری بین حروف و کلمات: letter-spacing و word-spacing
• 26. کار با رنگ‌ها در CSS: نام رنگ، HEX, RGB و HSL
• 27. مفهوم شفافیت با RGBA و HSLA
• 28. استایل‌دهی به پس‌زمینه: background-color و background-image
• 29. کنترل تکرار و موقعیت تصویر پس‌زمینه
• 30. خصوصیت background-size: cover و contain
• 31. استایل‌دهی به لیست‌ها: list-style-type و list-style-image
• 32. خصوصیت display: درک تفاوت block, inline و inline-block
• 33. مخفی کردن عناصر: display: none در مقابل visibility: hidden
• 34. انتخابگرهای ترکیبی (Combinators): Descendant, Child, Adjacent Sibling, General Sibling
• 35. مقدمه‌ای بر چیدمان (Layout) با Flexbox
• 36. Flexbox: معرفی کانتینر و آیتم‌ها
• 37. خصوصیت flex-direction برای تعیین جهت چیدمان
• 38. تراز کردن آیتم‌ها در محور اصلی با justify-content
• 39. تراز کردن آیتم‌ها در محور متقاطع با align-items
• 40. کنترل چینش چندین خط با align-content
• 41. خصوصیات flex-grow, flex-shrink و flex-basis برای آیتم‌ها
• 42. مرتب‌سازی آیتم‌ها با خصوصیت order
• 43. مقدمه‌ای بر چیدمان پیشرفته با CSS Grid
• 44. Grid: تعریف کانتینر و آیتم‌ها
• 45. ایجاد ستون‌ها و ردیف‌ها با grid-template-columns و grid-template-rows
• 46. واحد fr و کاربرد آن در Grid
• 47. تنظیم فاصله بین آیتم‌ها با gap
• 48. موقعیت‌دهی آیتم‌ها در Grid با شماره خطوط
• 49. ادغام سلول‌ها با grid-column-start/end و grid-row-start/end
• 50. نام‌گذاری نواحی در Grid با grid-template-areas
• 51. مفهوم Position در CSS: static, relative, absolute, fixed
• 52. کاربرد position: relative برای ایجاد نقطه مرجع
• 53. کاربرد position: absolute برای موقعیت‌دهی دقیق
• 54. ساخت هدر یا سایدبار ثابت با position: fixed
• 55. ایجاد هدرهای چسبان (Sticky Headers) با position: sticky
• 56. کنترل لایه‌ها روی هم با z-index
• 57. استایل‌دهی به لینک‌ها و حالت‌های مختلف آن: link, visited, hover, active
• 58. شبه‌کلاس‌ها (Pseudo-classes): first-child, last-child, nth-child
• 59. کاربرد nth-child برای ساخت جداول شطرنجی (Zebra-Striping)
• 60. شبه‌عناصر (Pseudo-elements): before:: و after::
• 61. استفاده از before:: و after:: برای افزودن آیکون یا محتوای تزئینی
• 62. استایل‌دهی به فرم‌ها: استایل‌دهی به Input و Textarea
• 63. طراحی دکمه‌های واکنش‌گرا و جذاب (Buttons)
• 64. استایل‌دهی به Checkbox و Radio Button
• 65. استایل‌دهی به منوهای کشویی (Dropdown/Select)
• 66. ساخت جداول داده خوانا برای گزارشات ناوگان
• 67. استایل‌دهی به سربرگ (thead) و بدنه (tbody) جدول
• 68. طراحی کارت‌ها (Cards) برای نمایش اطلاعات خودروها و رانندگان
• 69. پیاده‌سازی ویجت‌های داشبورد (Dashboard Widgets)
• 70. استایل‌دهی به نوتیفیکیشن‌ها و هشدارهای سیستم (Alerts & Notifications)
• 71. ساخت نشانگرها و برچسب‌ها (Badges & Labels)
• 72. طراحی نوارهای پیشرفت (Progress Bars) برای نمایش وضعیت‌ها
• 73. استایل‌دهی به Tooltip برای نمایش اطلاعات اضافی
• 74. مقدمه‌ای بر طراحی واکنش‌گرا (Responsive Design)
• 75. کار با Media Queries برای انطباق با اندازه‌های مختلف صفحه
• 76. رویکرد Mobile-First در طراحی واکنش‌گرا
• 77. استفاده از Media Queries برای داشبوردهای تبلت و دسکتاپ
• 78. واکنش‌گرا کردن تصاویر و ویدئوها
• 79. تایپوگرافی واکنش‌گرا با واحدهای vw و تابع clamp()
• 80. متحرک‌سازی روان با CSS Transitions
• 81. کنترل زمان‌بندی و تاخیر در Transitions
• 82. انیمیشن‌های پیچیده‌تر با CSS Animations و @keyframes
• 83. تغییر شکل عناصر با 2D Transforms: translate, rotate, scale
• 84. تغییر شکل عناصر در فضای سه‌بعدی با 3D Transforms
• 85. مفهوم و کاربرد متغیرهای CSS (Custom Properties)
• 86. استفاده از متغیرها برای ایجاد تم‌های رنگی (Theming) در داشبورد
• 87. متغیرهای CSS برای مدیریت یکپارچه فونت‌ها و فاصله‌گذاری‌ها
• 88. استفاده از توابع CSS: calc(), min(), max(), clamp()
• 89. فیلترهای گرافیکی با خصوصیت filter: blur, grayscale, brightness
• 90. ترکیب لایه‌ها با background-blend-mode و mix-blend-mode
• 91. استایل‌دهی بر اساس خصوصیات عناصر (Attribute Selectors)
• 92. سازماندهی فایل‌های CSS در پروژه‌های بزرگ
• 93. معرفی متدولوژی BEM برای نام‌گذاری خوانا و قابل نگهداری
• 94. مقدمه‌ای بر پیش‌پردازنده‌های CSS مانند SASS/SCSS
• 95. بهینه‌سازی عملکرد: کاهش حجم فایل CSS (Minification)
• 96. مبحث Critical CSS برای افزایش سرعت بارگذاری اولیه
• 97. سازگاری با مرورگرهای مختلف و استفاده از Vendor Prefixes
• 98. ابزارهای توسعه‌دهنده مرورگر (DevTools) برای دیباگ کردن CSS
• 99. ملاحظات دسترس‌پذیری (Accessibility): استایل‌دهی به حالت focus
• 100. استفاده از مدیا کوئری prefers-reduced-motion برای کاربران حساس