کتاب صوتی CSS for Mentorship Programs

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

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

عنوان دوره: دوره CSS for Mentorship Programs

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

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

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

• 1. مقدمه‌ای بر CSS و نقش آن در طراحی وب
• 2. روش‌های افزودن CSS به HTML (Inline, Internal, External)
• 3. قواعد دستوری CSS (Syntax)
• 4. معرفی انتخابگرها (Selectors)
• 5. انتخابگرهای نوعی (Type Selectors)
• 6. انتخابگرهای کلاسی (Class Selectors)
• 7. انتخابگرهای ID
• 8. کامنت‌گذاری در CSS
• 9. مدل جعبه‌ای (Box Model): معرفی و اجزا
• 10. مفهوم Content و تنظیمات آن
• 11. Padding: فاصله داخلی و تنظیمات آن
• 12. Border: حاشیه و انواع آن
• 13. Margin: فاصله خارجی و تنظیمات آن
• 14. خاصیت Display و مقادیر آن (block, inline, inline-block, none)
• 15. تنظیم عرض (Width) و ارتفاع (Height)
• 16. واحدهای اندازه‌گیری در CSS (px, em, rem, %, vw, vh, etc.)
• 17. رنگ‌ها در CSS (HEX, RGB, RGBA, HSL, HSLA, Named Colors)
• 18. خاصیت Background-color
• 19. خاصیت Background-image
• 20. سایر خواص Background (repeat, position, size, attachment)
• 21. خواص Font (family, size, weight, style, variant)
• 22. خواص Text (color, align, decoration, transform, indent, spacing)
• 23. آشنایی با Cascade، Specificity و Inheritance
• 24. قوانین CSS Reset و Normalize
• 25. موقعیت‌دهی عناصر (Positioning): static, relative
• 26. موقعیت‌دهی عناصر (Positioning): absolute, fixed, sticky
• 27. خاصیت Z-index برای لایه‌بندی
• 28. مدیریت Overflows (visible, hidden, scroll, auto)
• 29. استفاده از Floats برای چیدمان
• 30. پاک‌سازی Floats (Clearfix Hack)
• 31. معرفی Flexbox: یک راه حل قدرتمند برای چیدمان
• 32. خواص Flex Container (flex-direction, flex-wrap)
• 33. خواص Flex Container (justify-content, align-items, align-content)
• 34. خواص Flex Item (order, flex-grow, flex-shrink, flex-basis)
• 35. خواص Flex Item (align-self, flex shorthand)
• 36. مثال‌های عملی چیدمان با Flexbox
• 37. معرفی CSS Grid Layout: چیدمان دو بعدی
• 38. خواص Grid Container (grid-template-columns, grid-template-rows)
• 39. خواص Grid Container (grid-template-areas, gap)
• 40. خواص Grid Item (grid-column, grid-row, grid-area)
• 41. خواص Grid Item (justify-self, align-self, place-self)
• 42. Grid Auto-flow و Implicit Grid
• 43. توابع `minmax()`, `repeat()` در Grid
• 44. مثال‌های عملی چیدمان با CSS Grid
• 45. اصول طراحی واکنش‌گرا (Responsive Design)
• 46. Media Queries: معرفی و سینتکس
• 47. تنظیم Viewport Meta Tag
• 48. رویکرد Mobile-First در طراحی واکنش‌گرا
• 49. انتخابگرهای رابطه ای (Combinators): Descendant, Child, Adjacent Sibling, General Sibling
• 50. انتخابگرهای ویژگی (Attribute Selectors)
• 51. شبه‌کلاس‌ها (Pseudo-classes): `hover`, `active`, `focus`, `visited`, `link`
• 52. شبه‌کلاس‌ها (Pseudo-classes): `first-child`, `last-child`, `nth-child`
• 53. سایر شبه‌کلاس‌ها (`:not()`, `:empty()`, `:target`, etc.)
• 54. شبه‌عناصر (Pseudo-elements): `::before`, `::after`
• 55. شبه‌عناصر (Pseudo-elements): `::first-line`, `::first-letter`, `::selection`
• 56. شفافیت با خاصیت Opacity
• 57. Outline و خواص آن
• 58. سایه جعبه (Box Shadow)
• 59. سایه متن (Text Shadow)
• 60. گرادیان‌ها (Gradients): Linear Gradients
• 61. گرادیان‌ها (Gradients): Radial و Conic Gradients
• 62. فیلترها (Filters): `blur`, `brightness`, `contrast`, `grayscale`
• 63. فیلترها (Filters): `hue-rotate`, `invert`, `saturate`, `sepia`, `drop-shadow`
• 64. Blend Modes: `mix-blend-mode`, `background-blend-mode`
• 65. ترنزیشن‌ها (Transitions): خواص و کاربردها
• 66. ترنسفرم‌ها (Transforms): `translate`, `rotate`, `scale`, `skew`
• 67. ترنسفرم‌های 3D: `rotateX`, `rotateY`, `rotateZ`, `perspective`
• 68. انیمیشن‌ها (Animations): `keyframes` و خواص انیمیشن
• 69. متغیرهای CSS (Custom Properties)
• 70. تابع `calc()` برای محاسبات در CSS
• 71. توابع `clamp()`, `min()`, `max()`
• 72. سفارشی‌سازی فونت‌ها با `@font-face`
• 73. استفاده از آیکون‌فونت‌ها و SVG در CSS
• 74. استایل‌دهی به فرم‌ها و عناصر ورودی
• 75. استایل‌دهی پیشرفته دکمه‌ها
• 76. طراحی جدول با CSS
• 77. خاصیت `object-fit` و `object-position` برای تصاویر
• 78. CSS Sprites برای بهینه‌سازی تصاویر
• 79. معرفی معماری‌های CSS (BEM, OOCSS, SMACSS)
• 80. CSS ماژولار و قابل نگهداری
• 81. آشنایی با CSS Preprocessors (مانند Sass و Less)
• 82. متغیرها، Nesting و Mixins در Preprocessors
• 83. معرفی PostCSS
• 84. مفهوم CSS-in-JS (بررسی اجمالی)
• 85. بهینه‌سازی عملکرد CSS (Minification, Critical CSS)
• 86. ابزارهای توسعه‌دهنده مرورگر برای CSS
• 87. اشکال‌زدایی (Debugging) مشکلات CSS
• 88. سازگاری مرورگرها (Cross-browser Compatibility)
• 89. Vendor Prefixes و مدیریت آنها
• 90. بررسی قابلیت‌های مدرن CSS با `Can I Use...`
• 91. دسترسی‌پذیری (Accessibility) در CSS: اصول و کاربردها
• 92. مدیریت Focus در رابط کاربری
• 93. پیاده‌سازی Dark Mode با `prefers-color-scheme`
• 94. استایل‌دهی برای چاپ (`@media print`)
• 95. استفاده از `display: contents`
• 96. خاصیت `aspect-ratio`
• 97. Scroll Snapping
• 98. خواص منطقی (Logical Properties)
• 99. معرفی Subgrid و Container Queries (مفاهیم آینده)
• 100. پروژه عملی: پیاده‌سازی یک UI با بهترین شیوه‌های CSS