دوره CSS for Quality Assurance همراه با فلش‌کارت آموزشی — ارائه روی فلش مموری

📚 کتاب آموزشی جامع

📚 اطلاعات کتاب

عنوان کتاب: کتاب CSS for Quality Assurance

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

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

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

• 1. مقدمه‌ای بر توسعه وب و نقش تضمین کیفیت
• 2. CSS چیست؟ دیدگاهی از منظر تضمین کیفیت
• 3. قواعد و ساختار پایه CSS
• 4. نحوه اتصال CSS: Inline, Internal, External
• 5. انتخابگرهای اصلی: Type, Class, ID
• 6. انتخابگرهای Universal و Grouping
• 7. قوانین آبشاری (The Cascade): درک اولویت‌ها
• 8. اهمیت (Specificity): چگونه قوانین انتخاب می‌شوند
• 9. وراثت (Inheritance): انتقال استایل‌ها
• 10. واحدهای CSS: Pixels, Ems, Rems
• 11. واحدهای نسبی Viewport: vw, vh, vmin, vmax
• 12. سیستم‌های رنگی: Keywords, Hex, RGB
• 13. رنگ‌های پیشرفته: RGBA, HSL, HSLA
• 14. ویژگی‌های پایه فونت: Family, Size, Weight
• 15. استایل‌دهی متن: Align, Decorate, Transform
• 16. Line-height و Spacing کلمات/حروف
• 17. مدل جعبه‌ای CSS: Content, Padding
• 18. مدل جعبه‌ای: Borders و Margins
• 19. درک عناصر Block و Inline
• 20. ویژگی `display`: block, inline, inline-block
• 21. معرفی ابزارهای توسعه‌دهنده مرورگر (Elements Tab)
• 22. بازرسی و ویرایش استایل‌ها در DevTools
• 23. بازنشانی و نرمال‌سازی‌های پایه CSS
• 24. کامنت‌ها در CSS و خوانایی کد
• 25. استایل‌دهی تصاویر: عرض، ارتفاع، حاشیه
• 26. رنگ و تصویر پس‌زمینه
• 27. موقعیت، تکرار و اندازه پس‌زمینه
• 28. ویژگی‌های `opacity` و `visibility`
• 29. موقعیت‌دهی عناصر: `static`, `relative`
• 30. موقعیت‌دهی مطلق (Absolute) و چالش‌های QA آن
• 31. موقعیت‌دهی Fixed و Sticky
• 32. درک `z-index` و Stacking Context
• 33. مقدمه‌ای بر Floats و پاکسازی آن‌ها
• 34. تکنیک Clearfix
• 35. مقدمه‌ای بر چیدمان Flexbox
• 36. ویژگی‌های Flex Container: `flex-direction`
• 37. `justify-content` برای تراز افقی
• 38. `align-items` برای تراز عمودی
• 39. `flex-wrap` و `flex-flow`
• 40. ویژگی‌های Flex Item: `flex-grow`, `flex-shrink`, `flex-basis`
• 41. `order` و `align-self` برای Flex Items
• 42. مقدمه‌ای بر چیدمان CSS Grid
• 43. ویژگی‌های Grid Container: `grid-template-columns`, `grid-template-rows`
• 44. `grid-gap` (row-gap, column-gap)
• 45. قرار دادن آیتم‌های گرید: `grid-column`, `grid-row`
• 46. نام‌گذاری خطوط و نواحی گرید (`grid-area`)
• 47. اصول طراحی واکنش‌گرا (Responsive Design)
• 48. Media Queries: `min-width`, `max-width`, `orientation`
• 49. تگ متا Viewport و اهمیت آن برای QA
• 50. تست واکنش‌گرایی با DevTools
• 51. شبه‌کلاس‌ها (Pseudo-classes): `:hover`, `:active`, `:focus`
• 52. شبه‌کلاس‌های ساختاری: `:first-child`, `:last-child`, `:nth-child`
• 53. شبه‌کلاس‌های وضعیت UI: `:checked`, `:disabled`, `:valid`, `:invalid`
• 54. شبه‌عناصر (Pseudo-elements): `::before`, `::after` برای تولید محتوا
• 55. پس‌زمینه‌های پیشرفته: گرادیان‌ها (خطی، شعاعی)
• 56. Box Shadows و Text Shadows
• 57. Border-radius و Border Images
• 58. تبدیل‌های CSS: `translate`, `rotate`, `scale`
• 59. انتقال‌های CSS: Property, Duration, Timing Function
• 60. انیمیشن‌های CSS: `@keyframes` و ویژگی‌های انیمیشن
• 61. ویژگی‌های سفارشی (CSS Variables) برای تم‌سازی
• 62. ویژگی‌های `object-fit` و `object-position`
• 63. ویژگی `filter` برای جلوه‌های تصویری
• 64. `mix-blend-mode` برای تعامل لایه‌ها
• 65. مقدمه‌ای بر تست رگرسیون بصری
• 66. ابزارهای تست رگرسیون بصری (مانند Percy, Chromatic)
• 67. راه‌اندازی تست‌های رگرسیون بصری
• 68. تحلیل و گزارش مغایرت‌های بصری
• 69. سازگاری بین مرورگرها: مشکلات رایج CSS
• 70. استراتژی‌های تست بین مرورگرها
• 71. استفاده از BrowserStack/Sauce Labs برای QA در CSS
• 72. رفع اشکال مشکلات چیدمان بین مرورگرها
• 73. مقدمه‌ای بر دسترسی‌پذیری وب (اصول WCAG)
• 74. تست کنتراست رنگی با CSS
• 75. اطمینان از ناوبری با کیبورد و استایل‌های Focus
• 76. HTML معنایی و تأثیر آن بر دسترسی‌پذیری CSS
• 77. استفاده از Lighthouse برای ممیزی‌های دسترسی‌پذیری
• 78. Axe-core و سایر ابزارهای خودکار دسترسی‌پذیری
• 79. تست عملکرد با CSS: Layout, Paint, Compose
• 80. Critical CSS و نقش آن در عملکرد
• 81. کوچک‌سازی CSS و بهینه‌سازی استایل‌شیت‌ها
• 82. بارگذاری تنبل CSS: تکنیک‌ها و مزایا
• 83. اندازه‌گیری عملکرد CSS با DevTools
• 84. مقدمه‌ای بر پیش‌پردازنده‌های CSS (Sass/Less) برای QA
• 85. پس‌پردازش خودکار با Autoprefixer
• 86. Linting کد CSS با Stylelint
• 87. متدولوژی‌های CSS (BEM, OOCSS, SMACSS) برای یکپارچگی
• 88. نوشتن سناریوهای تست مؤثر برای CSS
• 89. گزارش‌دهی باگ‌های CSS: مراحل واضح و اسکرین‌شات‌ها
• 90. رفع اشکال مشکلات Specifity و Cascade
• 91. مدیریت چیدمان‌های راست به چپ (RTL) و Mirroring
• 92. تست استایل‌شیت‌های پرینت (`@media print`)
• 93. اطمینان از حالت‌های تعاملی سازگار (hover, focus, active, disabled)
• 94. اعتبارسنجی CSS با W3C CSS Validator
• 95. درک FOUC (Flash of Unstyled Content) و پیشگیری
• 96. تست تغییرات دینامیک CSS که توسط JavaScript فعال می‌شوند
• 97. جنبه‌های امنیتی CSS: Sanitization و CSP
• 98. خودکارسازی بررسی‌های CSS در پایپلاین‌های CI/CD
• 99. همکاری با توسعه‌دهندگان در مورد بهترین روش‌های CSS
• 100. بهبود مستمر در تضمین کیفیت CSS