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

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

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

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

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

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

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

• 1. مقدمه‌ای بر CSS: چیستی و چرایی
• 2. نحوه افزودن CSS به صفحات (Inline, Internal, External)
• 3. Syntax پایه CSS و Rule Setها
• 4. انتخابگرها: Type Selector, Class Selector, ID Selector
• 5. انتخابگرهای ترکیبی (Combinators): Descendant, Child, Adjacent Sibling, General Sibling
• 6. انتخابگرهای ویژگی (Attribute Selectors)
• 7. مفهوم Box Model: Content, Padding, Border, Margin
• 8. واحدهای اندازه‌گیری در CSS: px, em, rem, %
• 9. واحدهای Viewport: vw, vh, vmin, vmax
• 10. مدیریت رنگ‌ها: Keywords, Hex, RGB, RGBA
• 11. مدیریت رنگ‌ها: HSL, HSLA
• 12. آشنایی با متن و فونت: font-family, font-size, font-weight
• 13. استایل‌دهی متن: line-height, text-align, text-decoration, text-transform
• 14. استایل‌دهی پس‌زمینه: background-color, background-image
• 15. کنترل پس‌زمینه: background-repeat, background-position, background-size
• 16. استایل‌دهی border و border-radius
• 17. مفهوم Cascade و Specificity
• 18. مفهوم Inheritance (وراثت)
• 19. Display Property: block, inline, inline-block
• 20. Display Property: none و visibility
• 21. مبانی Position Property: static, relative
• 22. Position Property: absolute, fixed
• 23. Position Property: sticky
• 24. مفهوم z-index برای لایه‌بندی
• 25. Overlapping و Overflow Property
• 26. Float و Clear: چیدمان سنتی
• 27. Clearfix Technique
• 28. مقدمه‌ای بر Flexbox: Flexible Box Layout
• 29. Container Properties در Flexbox: display: flex, flex-direction
• 30. Container Properties در Flexbox: flex-wrap, flex-flow
• 31. Container Properties در Flexbox: justify-content
• 32. Container Properties در Flexbox: align-items
• 33. Container Properties در Flexbox: align-content
• 34. Item Properties در Flexbox: order, flex-grow
• 35. Item Properties در Flexbox: flex-shrink, flex-basis
• 36. Item Properties در Flexbox: flex shorthand, align-self
• 37. مقدمه‌ای بر CSS Grid Layout
• 38. Container Properties در Grid: display: grid, grid-template-columns
• 39. Container Properties در Grid: grid-template-rows, grid-template-areas
• 40. Container Properties در Grid: grid-gap, row-gap, column-gap
• 41. Container Properties در Grid: justify-items, align-items, place-items
• 42. Container Properties در Grid: justify-content, align-content, place-content
• 43. Item Properties در Grid: grid-column, grid-row
• 44. Item Properties در Grid: grid-area
• 45. implicit grid و auto-placement
• 46. اصول طراحی واکنش‌گرا (Responsive Web Design)
• 47. متا تگ Viewport
• 48. معرفی Media Queries: syntax و کاربردها
• 49. Media Queries: Breakpoints (min-width, max-width)
• 50. Media Queries: orientation و resolution
• 51. Mobile-First در مقابل Desktop-First
• 52. تصاویر و ویدئوهای واکنش‌گرا
• 53. تایپوگرافی واکنش‌گرا
• 54. Navigations واکنش‌گرا (منوهای همبرگری و غیره)
• 55. Pseudo-classes: link, visited, hover, active, focus
• 56. Pseudo-classes: first-child, last-child, nth-child
• 57. Pseudo-classes: first-of-type, last-of-type, nth-of-type
• 58. Pseudo-classes: empty, only-child, only-of-type
• 59. Pseudo-classes: not(), :has(), :where(), :is()
• 60. Pseudo-elements: before, after, first-letter, first-line
• 61. Pseudo-elements: selection, marker, placeholder
• 62. Custom Properties (CSS Variables): تعریف و استفاده
• 63. تابع calc() در CSS
• 64. توابع min(), max(), clamp()
• 65. مدیریت cursor و pointer events
• 66. استایل‌دهی دکمه‌ها و لینک‌ها (با تاکید بر UX)
• 67. استایل‌دهی فرم‌های ورودی (Input, Textarea, Select)
• 68. استایل‌دهی چک‌باکس‌ها و رادیو‌باتن‌ها
• 69. استایل‌دهی جداول داده پیچیده
• 70. مدیریت و استایل‌دهی Scrollbarها
• 71. Transform Property: translate() (2D & 3D)
• 72. Transform Property: rotate() (2D & 3D)
• 73. Transform Property: scale() (2D & 3D)
• 74. Transform Property: skew() (2D)
• 75. Transform Origin و Perspective
• 76. Transition Property: transition-property, transition-duration
• 77. Transition Property: transition-timing-function, transition-delay
• 78. Transition Shorthand
• 79. معرفی Animations با @keyframes
• 80. Animation Properties: animation-name, animation-duration
• 81. Animation Properties: animation-timing-function, animation-delay
• 82. Animation Properties: animation-iteration-count, animation-direction
• 83. Animation Properties: animation-fill-mode, animation-play-state
• 84. Animation Shorthand
• 85. Filter Property: blur(), brightness(), contrast()
• 86. Filter Property: grayscale(), hue-rotate(), invert()
• 87. Filter Property: saturate(), sepia(), drop-shadow()
• 88. Opacity و Mix-blend-mode
• 89. Clip-path Property: اشکال هندسی و SVG
• 90. Object-fit و Object-position برای تصاویر و ویدئو
• 91. بهینه‌سازی عملکرد CSS (CSS Performance)
• 92. مدیریت فایل‌های CSS (سازماندهی و ماژولار کردن)
• 93. اصول CSS Preprocessors (Sass/Less): مفاهیم پایه و مزایا
• 94. متدولوژی‌های CSS: BEM (Block, Element, Modifier) و کاربرد آن
• 95. اصول طراحی داشبورد برای مدیریت ناوگان (UI/UX)
• 96. استایل‌دهی نقشه‌های تعاملی و نمایش موقعیت ناوگان در زمان واقعی
• 97. استایل‌دهی نمودارها و ویژوالایزیشن داده‌های تحلیلی ناوگان
• 98. طراحی رابط کاربری (UI) قابل دسترس (Accessibility) برای اپراتورهای ناوگان
• 99. Themeing و Branding برای برنامه‌های سازمانی مدیریت ناوگان
• 100. نکات پیشرفته: مرورگرهای مختلف، Fallbackها و تکنیک‌های آینده CSS