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

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

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

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

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

📋 سرفصل‌های دوره (100 موضوع)

• 1. مبانی CSS برای وبلاگ‌های مدیریت ناوگان
• 2. مقدمه ای بر CSS و اهمیت آن در طراحی وب
• 3. آشنایی با syntax CSS: selector، property و value
• 4. نحوه اتصال CSS به HTML: inline، internal و external
• 5. آشنایی با cascade و inheritance در CSS
• 6. سلکتورهای CSS: tag selectors، class selectors و ID selectors
• 7. سلکتورهای ترکیبی: descendant selectors، child selectors و adjacent sibling selectors
• 8. سلکتورهای attribute و pseudo-classes
• 9. واحد های اندازه گیری در CSS: px، em، rem، %، vw، vh
• 10. کار با رنگ‌ها در CSS: hexadecimal، RGB، RGBA و HSL
• 11. آشنایی با مدل جعبه ای CSS (Box Model): content، padding، border و margin
• 12. تنظیم اندازه و فاصله عناصر با استفاده از padding و margin
• 13. استایل دهی به متن: font-family، font-size، font-weight، text-align، line-height
• 14. کار با لیست ها: list-style-type، list-style-position و list-style-image
• 15. استایل دهی به لینک ها: hover، visited، active و focus
• 16. کار با تصاویر در CSS: background-image، background-size، background-position و background-repeat
• 17. استفاده از border-radius برای ایجاد لبه های گرد
• 18. کار با سایه ها: box-shadow و text-shadow
• 19. آشنایی با display property: block، inline، inline-block و none
• 20. موقعیت دهی عناصر: static، relative، absolute و fixed
• 21. کار با float property و clear property
• 22. آشنایی با Flexbox: container و items
• 23. تنظیم جهت عناصر با flex-direction: row، column، row-reverse و column-reverse
• 24. توزیع فضا بین عناصر با justify-content: flex-start، flex-end، center، space-between و space-around
• 25. ترازبندی عناصر با align-items: flex-start، flex-end، center، stretch و baseline
• 26. کار با flex-grow، flex-shrink و flex-basis
• 27. آشنایی با CSS Grid: container و items
• 28. تعریف سطرها و ستون ها با grid-template-rows و grid-template-columns
• 29. موقعیت دهی عناصر با grid-row-start، grid-row-end، grid-column-start و grid-column-end
• 30. استفاده از grid-gap برای ایجاد فاصله بین عناصر
• 31. آشنایی با مفاهیم responsive design
• 32. استفاده از viewport meta tag برای بهینه سازی نمایش در موبایل
• 33. آشنایی با media queries: min-width، max-width، orientation
• 34. استفاده از media queries برای ایجاد طرح بندی های مختلف بر اساس اندازه صفحه نمایش
• 35. ایجاد منوهای واکنش گرا (responsive menus)
• 36. بهینه سازی تصاویر برای دستگاه های مختلف
• 37. آشنایی با framework های CSS: Bootstrap، Tailwind CSS و Materialize
• 38. نصب و راه اندازی Bootstrap
• 39. استفاده از Bootstrap grid system برای ایجاد طرح بندی
• 40. استفاده از Bootstrap components: buttons، forms، navigation bars
• 41. استفاده از Tailwind CSS utility classes
• 42. سفارشی سازی Tailwind CSS configuration
• 43. آشنایی با CSS preprocessors: Sass و Less
• 44. نصب و راه اندازی Sass
• 45. آشنایی با متغیرها (variables) در Sass
• 46. استفاده از nesting در Sass
• 47. آشنایی با mixins و extends در Sass
• 48. کامپایل فایل های Sass به CSS
• 49. آشنایی با CSS animations
• 50. استفاده از @keyframes برای تعریف انیمیشن ها
• 51. تنظیم duration، delay و iteration-count برای انیمیشن ها
• 52. آشنایی با CSS transitions
• 53. استفاده از transition property برای ایجاد انتقال های روان
• 54. کار با transform property: translate، rotate، scale و skew
• 55. آشنایی با CSS filters: blur، brightness، contrast، grayscale و sepia
• 56. ایجاد افکت های hover با استفاده از transitions و transforms
• 57. بهینه سازی CSS برای سرعت بارگذاری صفحه
• 58. Minify کردن فایل های CSS
• 59. استفاده از CSS sprites برای کاهش درخواست های HTTP
• 60. استفاده از CDN برای تحویل فایل های CSS
• 61. آشنایی با مفاهیم accessibility (دسترسی پذیری)
• 62. استفاده از semantic HTML
• 63. ارائه متن جایگزین (alt text) برای تصاویر
• 64. استفاده از رنگ های با کنتراست بالا
• 65. ایجاد فرم های قابل دسترس
• 66. آشنایی با CSS naming conventions: BEM، SMACSS و OOCSS
• 67. استفاده از BEM (Block، Element، Modifier) برای نامگذاری کلاس ها
• 68. آشنایی با principles of OOCSS (Object-Oriented CSS)
• 69. استفاده از SMACSS (Scalable and Modular Architecture for CSS) برای سازماندهی CSS
• 70. آشنایی با CSS reset و normalize.css
• 71. استفاده از CSS reset برای حذف استایل های پیش فرض مرورگر
• 72. استفاده از normalize.css برای یکسان سازی استایل ها در مرورگرهای مختلف
• 73. آشنایی با CSS variables (custom properties)
• 74. تعریف و استفاده از CSS variables
• 75. استفاده از CSS variables برای ایجاد تم های مختلف
• 76. آشنایی با CSS Grid Layout Module Level 2
• 77. ایجاد طرح بندی های پیچیده با grid-template-areas
• 78. استفاده از minmax() function در CSS Grid
• 79. آشنایی با CSS Shapes
• 80. ایجاد شکل های غیر مستطیلی با CSS Shapes
• 81. استفاده از clip-path property
• 82. آشنایی با CSS Blend Modes
• 83. ترکیب رنگ ها و تصاویر با CSS Blend Modes
• 84. آشنایی با CSS Masking
• 85. پنهان کردن بخش هایی از عناصر با CSS Masking
• 86. آشنایی با CSS Containment
• 87. بهینه سازی رندرینگ صفحه با CSS Containment
• 88. آشنایی با CSS logical properties and values
• 89. استفاده از logical properties برای پشتیبانی از زبان های راست به چپ (RTL)
• 90. آشنایی با CSS writing-mode
• 91. تغییر جهت متن با CSS writing-mode
• 92. استفاده از CSS for چاپ
• 93. استایل دهی صفحات برای چاپ
• 94. مخفی کردن عناصر در چاپ
• 95. آشنایی با debugging CSS
• 96. استفاده از developer tools مرورگر برای اشکال زدایی CSS
• 97. آشنایی با CSSLint و stylelint
• 98. استفاده از linters برای بررسی کیفیت کد CSS
• 99. آشنایی با مفاهیم performance optimization
• 100. بهینه سازی CSS برای کاهش CLS (Cumulative Layout Shift)