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

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

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

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

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

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

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

• 1. مقدمه ای بر CSS و نقش آن در اکوسیستم مدیریت ناوگان
• 2. آشنایی با مفاهیم پایه CSS: انتخابگرها، ویژگی‌ها، و مقادیر
• 3. انواع انتخابگرها در CSS: المان، کلاس، ID
• 4. انتخابگرهای ترکیبی و شبه کلاس‌ها
• 5. انتخابگرهای شبه المان
• 6. اولویت دهی و وراثت در CSS
• 7. مدل جعبه‌ای CSS (Box Model): Content, Padding, Border, Margin
• 8. واحد‌های اندازه گیری در CSS: px, em, rem, %, vw, vh
• 9. رنگ ها در CSS: نام رنگ ها، Hexadecimal, RGB, RGBA, HSL, HSLA
• 10. آشنایی با فونت ها در CSS: Font-family, Font-size, Font-weight, Font-style
• 11. متن در CSS: Text-align, Text-decoration, Text-transform, Line-height, Letter-spacing
• 12. پس زمینه ها در CSS: Background-color, Background-image, Background-repeat, Background-position, Background-size
• 13. مقدمه ای بر Layout در CSS
• 14. آشنایی با Display Property: Block, Inline, Inline-block, None
• 15. موقعیت دهی عناصر با استفاده از Position Property: Static, Relative, Absolute, Fixed, Sticky
• 16. مقدمه ای بر Flexbox
• 17. مفاهیم Container و Items در Flexbox
• 18. ویژگی های Container در Flexbox: Flex-direction, Flex-wrap, Justify-content, Align-items, Align-content
• 19. ویژگی های Items در Flexbox: Flex-grow, Flex-shrink, Flex-basis, Order, Align-self
• 20. کاربرد Flexbox در ساخت Layout های ساده
• 21. مقدمه ای بر Grid Layout
• 22. مفاهیم Container و Items در Grid Layout
• 23. تعریف ردیف ها و ستون ها در Grid Layout: Grid-template-rows, Grid-template-columns
• 24. ویژگی های Container در Grid Layout: Grid-gap, Justify-items, Align-items, Justify-content, Align-content
• 25. ویژگی های Items در Grid Layout: Grid-column-start, Grid-column-end, Grid-row-start, Grid-row-end
• 26. کاربرد Grid Layout در ساخت Layout های پیچیده
• 27. رسپانسیو دیزاین (Responsive Design) چیست؟
• 28. Viewport Meta Tag
• 29. پرس و جوهای رسانه ای (Media Queries): Syntax و کاربرد
• 30. استفاده از Media Queries برای Device های مختلف
• 31. استفاده از Media Queries برای Orientation های مختلف
• 32. مخفی کردن و نمایش عناصر بر اساس اندازه صفحه نمایش
• 33. تغییر Layout بر اساس اندازه صفحه نمایش
• 34. تصاویر رسپانسیو: استفاده از تگ Picture و ویژگی های Srcset
• 35. واحد های اندازه گیری انعطاف پذیر: %, em, rem, vw, vh
• 36. استفاده از Flexbox و Grid Layout برای Layout های رسپانسیو
• 37. مقدمه ای بر CSS Frameworks
• 38. آشنایی با Bootstrap
• 39. نصب و راه اندازی Bootstrap
• 40. سیستم Grid در Bootstrap
• 41. کامپوننت های Bootstrap: Navbar, Buttons, Forms, Cards, Alerts
• 42. استفاده از Utilities Bootstrap
• 43. آشنایی با Tailwind CSS
• 44. نصب و راه اندازی Tailwind CSS
• 45. مفاهیم Atomic CSS
• 46. کلاس های Utility در Tailwind CSS
• 47. سفارشی سازی Tailwind CSS
• 48. مقایسه Bootstrap و Tailwind CSS
• 49. مقدمه ای بر CSS Preprocessors
• 50. آشنایی با Sass
• 51. نصب و راه اندازی Sass
• 52. متغیرها در Sass
• 53. Nest ها در Sass
• 54. Mixin ها در Sass
• 55. Extend/Inheritance در Sass
• 56. Import کردن فایل ها در Sass
• 57. توابع (Functions) در Sass
• 58. شرط ها (Conditionals) و حلقه ها (Loops) در Sass
• 59. استفاده از Sass در پروژه های واقعی
• 60. مفاهیم CSS Modules
• 61. استفاده از CSS Modules در React
• 62. استفاده از CSS Modules در Vue.js
• 63. استفاده از CSS Modules در Angular
• 64. مقدمه ای بر Styled Components
• 65. استفاده از Styled Components در React
• 66. مزایا و معایب Styled Components
• 67. مقدمه ای بر CSS-in-JS
• 68. مقایسه CSS Modules و Styled Components و CSS-in-JS
• 69. انیمیشن ها در CSS: Transition
• 70. انیمیشن ها در CSS: Keyframes
• 71. Transforms در CSS: Translate, Rotate, Scale, Skew
• 72. ایجاد افکت های Hover با استفاده از CSS
• 73. ایجاد لودینگ (Loading) با استفاده از CSS
• 74. مقدمه ای بر accessibility (دسترسی پذیری) در CSS
• 75. استفاده از رنگ ها و کنتراست مناسب
• 76. ایجاد ساختار معنایی با استفاده از HTML و CSS
• 77. تست accessibility با استفاده از ابزارهای مختلف
• 78. بهینه سازی CSS برای بهبود عملکرد
• 79. Minify کردن CSS
• 80. استفاده از CDN برای CSS
• 81. Lazy Loading CSS
• 82. استفاده از Gzip Compression
• 83. استفاده از Browser Cache
• 84. بهینه سازی تصاویر پس زمینه
• 85. ابزارهای توسعه دهنده مرورگر (Browser Developer Tools)
• 86. اشکال زدایی (Debugging) CSS با استفاده از Chrome DevTools
• 87. اشکال زدایی CSS با استفاده از Firefox Developer Tools
• 88. بررسی Performance CSS با استفاده از ابزارهای Developer
• 89. استفاده از CSS Linting Tools
• 90. بهینه سازی CSS برای SEO
• 91. استفاده از کلمات کلیدی مناسب در CSS
• 92. ایجاد ساختار مناسب برای CSS
• 93. استفاده از Schema Markup
• 94. CSS Grid و Flexbox برای Layout های سئو دوستانه
• 95. بررسی سازگاری CSS با مرورگرهای مختلف
• 96. استفاده از Autoprefixer
• 97. تست CSS در مرورگرهای مختلف
• 98. مقدمه ای بر CSS Architecture
• 99. BEM (Block, Element, Modifier)
• 100. OOCSS (Object Oriented CSS)