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

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

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

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

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

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

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

• 1. مقدمه ای بر CSS و نقش آن در Fleet Management Handbooks
• 2. آشنایی با سینتکس CSS (انتخابگرها، خصوصیات، مقادیر)
• 3. نحوه اعمال CSS: Inline، Internal، External
• 4. انتخابگرهای CSS: بر اساس نوع، کلاس، ID
• 5. انتخابگرهای CSS: بر اساس صفت ها
• 6. انتخابگرهای CSS: شبه کلاس ها و شبه عناصر
• 7. Cascading و Specificity در CSS
• 8. وراثت در CSS
• 9. واحد های اندازه گیری در CSS: مطلق و نسبی (px, em, rem, %, vw, vh)
• 10. مدل جعبه ای CSS (Box Model): Content, Padding, Border, Margin
• 11. تنظیم عرض و ارتفاع عناصر
• 12. Margin و Padding: تنظیم فواصل داخلی و خارجی
• 13. Border: استایل دهی به حاشیه ها
• 14. Background: رنگ، تصویر، تکرار و موقعیت پس زمینه
• 15. تغییر رنگ متن و پس زمینه
• 16. فونت ها در CSS: انتخاب فونت، اندازه، وزن، استایل
• 17. استایل دهی به متن: فاصله بین حروف و خطوط
• 18. لیست ها در CSS: استایل دهی به لیست های مرتب و نامرتب
• 19. جدول ها در CSS: استایل دهی به جدول ها، ردیف ها و سلول ها
• 20. فرم ها در CSS: استایل دهی به فرم ها و عناصر ورودی
• 21. موقعیت دهی عناصر (Positioning): Static, Relative, Absolute, Fixed, Sticky
• 22. درک مفهوم Stacking Context
• 23. استفاده از z-index برای مدیریت لایه ها
• 24. Display Property: Block, Inline, Inline-Block, None
• 25. Float Property: نحوه شناور سازی عناصر
• 26. Clear Property: جلوگیری از شناور سازی
• 27. Flexbox: مقدمه ای بر Flexbox
• 28. Flexbox: محور اصلی و محور فرعی
• 29. Flexbox: تنظیم جهت و ترتیب عناصر
• 30. Flexbox: تراز کردن عناصر در محور اصلی
• 31. Flexbox: تراز کردن عناصر در محور فرعی
• 32. Flexbox: Flex Grow, Flex Shrink, Flex Basis
• 33. Grid Layout: مقدمه ای بر Grid Layout
• 34. Grid Layout: تعریف ردیف ها و ستون ها
• 35. Grid Layout: قرار دادن عناصر در Grid
• 36. Grid Layout: نامگذاری خطوط و مناطق Grid
• 37. Grid Layout: Grid Template Areas
• 38. Grid Layout: Grid Gap
• 39. Media Queries: مقدمه ای بر Media Queries
• 40. Media Queries: نوشتن Media Queries برای دستگاه های مختلف
• 41. Media Queries: استفاده از breakpoints برای طراحی واکنش گرا
• 42. واکنش گرا سازی تصاویر و ویدئوها
• 43. CSS Reset و Normalize.css
• 44. متغیر های CSS (Custom Properties)
• 45. توابع CSS: calc(), min(), max(), clamp()
• 46. گرادیانت ها در CSS: خطی و شعاعی
• 47. سایه ها در CSS: سایه متن و سایه جعبه
• 48. Transformations: Translate, Rotate, Scale, Skew
• 49. Transitions: ایجاد انیمیشن های ساده با Transition
• 50. Animations: ایجاد انیمیشن های پیچیده با Keyframes
• 51. Filter ها در CSS: Blur, Brightness, Contrast, Grayscale, Sepia
• 52. Blend Modes: ترکیب رنگ ها
• 53. Clip-path: برش دادن عناصر
• 54. Object-fit و Object-position برای تصاویر
• 55. استایل دهی به scrollbar
• 56. استفاده از فونت آیکون ها (Font Awesome)
• 57. ایجاد layout های متداول با Flexbox و Grid
• 58. طراحی دکمه های زیبا و کاربردی
• 59. ایجاد فرم های ورود و ثبت نام جذاب
• 60. استایل دهی به نوارهای ناوبری (Navigation Bars)
• 61. ایجاد اسلایدر تصاویر (Image Slider)
• 62. ایجاد مودال (Modal) یا پاپ آپ (Popup)
• 63. استفاده از CSS preprocessors (Sass/SCSS): مقدمه
• 64. متغیر ها در Sass/SCSS
• 65. Nesting در Sass/SCSS
• 66. Mixins در Sass/SCSS
• 67. Extends/Inheritance در Sass/SCSS
• 68. Partials و Modules در Sass/SCSS
• 69. عملگر های ریاضی در Sass/SCSS
• 70. توابع داخلی Sass/SCSS
• 71. کامپایل Sass/SCSS به CSS
• 72. استفاده از CSS frameworks (Bootstrap, Tailwind CSS)
• 73. مقدمه ای بر Bootstrap و نحوه نصب آن
• 74. Grid System در Bootstrap
• 75. کامپوننت های Bootstrap (Buttons, Forms, Navbar)
• 76. سفارشی سازی Bootstrap
• 77. مقدمه ای بر Tailwind CSS و نحوه نصب آن
• 78. Utility Classes در Tailwind CSS
• 79. کامپوننت های Tailwind CSS
• 80. سفارشی سازی Tailwind CSS
• 81. بهینه سازی CSS برای سرعت بارگذاری
• 82. Minification و Concatenation CSS
• 83. Code Splitting
• 84. استفاده از ابزار های Linting (Stylelint)
• 85. نامگذاری کلاس ها (BEM, SMACSS, OOCSS)
• 86. سازگاری CSS با مرورگر های مختلف (Cross-browser Compatibility)
• 87. Debugging CSS با استفاده از Developer Tools
• 88. Accessibility در CSS (ARIA attributes)
• 89. طراحی Dark Mode با CSS
• 90. استفاده از CSS-in-JS (Styled Components, Emotion)
• 91. CSS Modules
• 92. Web Components و Shadow DOM
• 93. ادغام CSS با HTML و JavaScript
• 94. استفاده از CSS برای Print Styles
• 95. راهکار های پیشرفته برای بهبود عملکرد CSS
• 96. نکات و ترفند های پیشرفته CSS
• 97. منابع و مراجع یادگیری CSS
• 98. پروژه عملی: طراحی یک Fleet Management Handbook کامل
• 99. پروژه عملی: ایجاد یک داشبورد مدیریتی با CSS
• 100. پروژه عملی: طراحی یک وبسایت ریسپانسیو برای Fleet Management