فلش‌کارت‌های آموزشی CSS for Fleet Management Landscape

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

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

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

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

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

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

• 1. مقدمه ای بر CSS و نقش آن در طراحی وب
• 2. CSS چیست و چه کاری انجام می دهد؟
• 3. آشنایی با سینتکس CSS (قواعد، انتخابگرها، ویژگی ها، مقادیر)
• 4. نحوه اضافه کردن CSS به صفحات HTML (داخلی، خارجی، درون خطی)
• 5. انتخابگرهای CSS: معرفی و انواع (عناصر، کلاس ها، شناسه ها)
• 6. انتخابگرهای CSS: ویژگی ها و شبه کلاس ها
• 7. انتخابگرهای CSS: ترکیب انتخابگرها (فرزند، نواده، همسایه مجاور، همسایه عمومی)
• 8. آشنایی با مدل جعبه ای CSS (Box Model): محتوا، حاشیه داخلی، حاشیه، مرز
• 9. مدیریت ابعاد عناصر: width, height, max-width, min-width, max-height, min-height
• 10. خاصیت display: انواع (block, inline, inline-block, none) و کاربردها
• 11. موقعیت دهی عناصر: static, relative, absolute, fixed, sticky
• 12. موقعیت دهی عناصر: درک و استفاده از z-index
• 13. مقدمه ای بر Flexbox: چیدمان انعطاف پذیر عناصر
• 14. Flexbox: خاصیت های flex-direction, flex-wrap, justify-content, align-items, align-content
• 15. Flexbox: خاصیت های flex-grow, flex-shrink, flex-basis
• 16. مقدمه ای بر Grid Layout: چیدمان جدولی عناصر
• 17. Grid Layout: خاصیت های grid-template-columns, grid-template-rows, grid-gap
• 18. Grid Layout: خاصیت های grid-column-start, grid-column-end, grid-row-start, grid-row-end
• 19. Grid Layout: استفاده از named grid lines و grid areas
• 20. آشنایی با واحدهای اندازه گیری در CSS: px, em, rem, %, vw, vh
• 21. اولویت بندی وراثت CSS: اهمیت و نحوه کارکرد
• 22. CSS Specificity: درک و مدیریت اولویت قوانین CSS
• 23. استفاده از !important: موارد استفاده و احتیاط ها
• 24. آشنایی با فونت ها در CSS: font-family, font-size, font-weight, font-style, line-height
• 25. مدیریت متن در CSS: text-align, text-decoration, text-transform, text-shadow
• 26. کار با رنگ ها در CSS: نام رنگ ها، مقادیر HEX، RGB, RGBA, HSL, HSLA
• 27. پس زمینه ها در CSS: background-color, background-image, background-repeat, background-position, background-size
• 28. Border ها در CSS: border-width, border-style, border-color, border-radius
• 29. لیست ها در CSS: list-style-type, list-style-position, list-style-image
• 30. جداول در CSS: border-collapse, border-spacing, caption-side, empty-cells
• 31. فرم ها در CSS: استایل دهی به عناصر فرم (input, textarea, select, button)
• 32. مقدمه ای بر CSS Transitions: ایجاد انیمیشن های ساده
• 33. CSS Transitions: خاصیت های transition-property, transition-duration, transition-timing-function, transition-delay
• 34. مقدمه ای بر CSS Animations: ایجاد انیمیشن های پیچیده تر
• 35. CSS Animations: استفاده از @keyframes
• 36. CSS Animations: خاصیت های animation-name, animation-duration, animation-timing-function, animation-delay, animation-iteration-count, animation-direction
• 37. مقدمه ای بر رسانه های واکنش گرا (Responsive Design)
• 38. Viewport Meta Tag: تنظیم مقیاس بندی صفحه برای دستگاه های مختلف
• 39. Media Queries: استفاده از @media برای اعمال استایل های مختلف بر اساس اندازه صفحه نمایش
• 40. طراحی با رویکرد Mobile First: مزایا و نحوه پیاده سازی
• 41. آشنایی با فریم ورک های CSS: Bootstrap و Tailwind CSS
• 42. نصب و راه اندازی Bootstrap
• 43. آشنایی با Grid System در Bootstrap
• 44. کامپوننت های Bootstrap: دکمه ها، فرم ها، ناوبری، هشدارها
• 45. استفاده از کلاس های utility در Bootstrap
• 46. نصب و راه اندازی Tailwind CSS
• 47. آشنایی با کلاس های Atomic در Tailwind CSS
• 48. استفاده از responsive prefixes در Tailwind CSS
• 49. سفارشی سازی Tailwind CSS: theme, colors, spacing, typography
• 50. آشنایی با CSS Preprocessors: Sass و Less
• 51. نصب و راه اندازی Sass
• 52. متغیرها در Sass
• 53. Nested Rules در Sass
• 54. Mixins در Sass
• 55. Extends/Inheritance در Sass
• 56. Partials و Modules در Sass
• 57. ایجاد حلقه ها و شرط ها در Sass
• 58. آشنایی با BEM (Block, Element, Modifier): یک متدولوژی نامگذاری کلاس های CSS
• 59. استفاده از icon fonts: Font Awesome و Material Icons
• 60. استایل دهی به SVG ها با CSS
• 61. استفاده از CSS variables (Custom Properties)
• 62. CSS Functions: calc(), min(), max(), clamp()
• 63. CSS Filters: blur, brightness, contrast, grayscale, sepia
• 64. CSS Blend Modes: background-blend-mode, mix-blend-mode
• 65. CSS Shapes: ایجاد اشکال غیر مستطیلی با CSS
• 66. CSS Clipping: clip-path
• 67. Gradients در CSS: Linear Gradients و Radial Gradients
• 68. CSS Shadows: box-shadow و text-shadow
• 69. ساخت منوهای Navigation با CSS
• 70. ساخت گالری تصاویر با CSS
• 71. ساخت اسلایدر تصاویر با CSS
• 72. طراحی داشبورد (Dashboard) با CSS
• 73. استفاده از CSS برای ایجاد تم (Theme) های مختلف
• 74. بهینه سازی CSS: minify کردن فایل های CSS
• 75. بهینه سازی CSS: استفاده از CSS Sprites
• 76. بهینه سازی CSS: اجتناب از استفاده بیش از حد از !important
• 77. آزمایش CSS در مرورگرهای مختلف: Cross-Browser Compatibility
• 78. ابزارهای تست CSS: Chrome DevTools, Firefox Developer Tools
• 79. اشکال زدایی CSS: Debugging
• 80. ارزیابی عملکرد CSS: Performance
• 81. مباحث پیشرفته CSS: CSS Houdini
• 82. مقدمه ای بر Web Accessibility و اهمیت آن
• 83. استفاده از ARIA attributes برای بهبود دسترسی
• 84. رنگ ها و کنتراست: اطمینان از خوانایی متن
• 85. استفاده صحیح از HTML Semantic
• 86. تست دسترسی وب سایت با ابزارهای خودکار
• 87. ساخت فرم های قابل دسترس
• 88. تکنیک های پنهان سازی محتوا برای خوانندگان صفحه نمایش
• 89. بهینه سازی CSS برای چاپ (Print Styles)
• 90. ایجاد یک سیستم طراحی (Design System) با CSS
• 91. مقدمه ای بر CSS-in-JS: Styled Components و Emotion
• 92. آشنایی با CSS Modules
• 93. استفاده از PostCSS برای تبدیل CSS
• 94. بررسی CSS Level 4: ویژگی های جدید و آینده
• 95. امنیت CSS: جلوگیری از حملات XSS با استایل دهی ایمن
• 96. ادغام CSS با JavaScript: دستکاری استایل ها با DOM
• 97. استفاده از CSS برای ایجاد Loading Animations
• 98. ایجاد تایپوگرافی جذاب با CSS
• 99. استفاده از CSS برای ساخت افکت های پارالاکس (Parallax)
• 100. ایجاد استایل های سفارشی برای اسکرول بار (Scrollbar)