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

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

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

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

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

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

• 1. معرفی CSS و کاربرد آن در طراحی وب
• 2. CSS چیست و چه مزایایی دارد؟
• 3. ساختار یک فایل CSS
• 4. روش‌های اضافه کردن CSS به HTML (inline, internal, external)
• 5. آشنایی با Selectorها در CSS
• 6. Selectorهای نوع Element
• 7. Selectorهای Class
• 8. Selectorهای ID
• 9. Selectorهای Attribute
• 10. Selectorهای Pseudo-class
• 11. Selectorهای Pseudo-element
• 12. درک Specificity در CSS
• 13. وراثت (Inheritance) در CSS
• 14. مقادیر و واحدهای CSS
• 15. واحدهای Absolute (px, cm, mm, in, pt, pc)
• 16. واحدهای Relative (em, rem, vw, vh, %)
• 17. رنگ‌ها در CSS (Hexadecimal, RGB, RGBA, HSL, HSLA)
• 18. کار با متن در CSS (font-family, font-size, font-weight, font-style)
• 19. تنظیم خطوط متن (line-height, text-align, text-decoration)
• 20. فاصله بین حروف و کلمات (letter-spacing, word-spacing)
• 21. تبدیل متن (text-transform)
• 22. سایه‌ها در CSS (text-shadow, box-shadow)
• 23. Box Model در CSS (content, padding, border, margin)
• 24. تنظیم Padding (padding-top, padding-right, padding-bottom, padding-left)
• 25. تنظیم Border (border-width, border-style, border-color)
• 26. تنظیم Margin (margin-top, margin-right, margin-bottom, margin-left)
• 27. انواع Display (block, inline, inline-block, none)
• 28. Positioning در CSS (static, relative, absolute, fixed, sticky)
• 29. درک Z-index
• 30. Float و Clear
• 31. طراحی Layout با استفاده از Float
• 32. معرفی Flexbox
• 33. Container Properties در Flexbox (flex-direction, flex-wrap, justify-content, align-items, align-content)
• 34. Item Properties در Flexbox (flex-grow, flex-shrink, flex-basis, align-self)
• 35. معرفی Grid Layout
• 36. Grid Container Properties (grid-template-columns, grid-template-rows, grid-gap)
• 37. Grid Item Properties (grid-column, grid-row, grid-area)
• 38. Responsive Design چیست؟
• 39. Media Queries
• 40. Viewport Meta Tag
• 41. استفاده از واحدهای Relative در Responsive Design
• 42. تصاویر Responsive
• 43. معرفی CSS Frameworkها (Bootstrap, Tailwind CSS)
• 44. استفاده از Bootstrap Grid System
• 45. استفاده از Bootstrap Components
• 46. سفارشی‌سازی Bootstrap
• 47. معرفی Tailwind CSS و Utility Classes
• 48. سفارشی‌سازی Tailwind CSS
• 49. انیمیشن در CSS (transitions)
• 50. keyframes و animations
• 51. Transformations (rotate, scale, translate, skew)
• 52. 2D Transforms
• 53. 3D Transforms
• 54. استفاده از CSS Variables (Custom Properties)
• 55. کار با Pseudo-elements پیشرفته (::before, ::after)
• 56. SVG در CSS (استفاده از SVG به عنوان background-image)
• 57. فیلترها در CSS (blur, grayscale, sepia)
• 58. Blend Modes (mix-blend-mode, background-blend-mode)
• 59. Masking و Clipping در CSS
• 60. Gradients (linear-gradient, radial-gradient, conic-gradient)
• 61. استفاده از Calc() در CSS
• 62. CSS Functions (min(), max(), clamp())
• 63. کار با فونت‌های سفارشی (font-face)
• 64. طراحی فرم‌ها با CSS
• 65. استایل‌دهی به جداول با CSS
• 66. Navigation Barها با CSS
• 67. Dropdown Menuها با CSS
• 68. Tabs و Accordions با CSS
• 69. Modalها با CSS
• 70. طراحی Cardها با CSS
• 71. ایجاد Carousel با CSS و Javascript
• 72. Preprocessors CSS (Sass, Less)
• 73. Sass Syntax
• 74. Variables در Sass
• 75. Mixins در Sass
• 76. Extend/Inheritance در Sass
• 77. Partials و Modules در Sass
• 78. Operators در Sass
• 79. Loops در Sass
• 80. Functions در Sass
• 81. Compass (CSS Authoring Framework)
• 82. CSS Modules
• 83. CSS-in-JS (Styled Components, Emotion)
• 84. Atomic CSS
• 85. BEM (Block, Element, Modifier) Methodology
• 86. OOCSS (Object-Oriented CSS)
• 87. SMACSS (Scalable and Modular Architecture for CSS)
• 88. CSS Architecture
• 89. بهینه‌سازی CSS (Minification, Compression)
• 90. CSS Linting (Stylelint)
• 91. تست CSS
• 92. کار با DevTools مرورگر برای دیباگ CSS
• 93. Accessibility (A11y) در CSS
• 94. Right-to-Left (RTL) Support در CSS
• 95. Cross-Browser Compatibility
• 96. CSS Reset و Normalize.css
• 97. CSS Shorthand Properties
• 98. ابزارهای طراحی رنگ و پالت رنگی
• 99. الگوهای طراحی وب و الهام‌گیری
• 100. پروژه‌ی عملی: طراحی یک داشبورد مدیریت ناوگان با CSS