اپلیکیشن اندرویدی فلش‌کارت آموزشی CSS for Narrative Design

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

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

عنوان دوره: دوره CSS for Narrative Design

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

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

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

• 1. مقدمه ای بر CSS برای طراحی روایی
• 2. نقش CSS در داستان سرایی بصری
• 3. تفاوت بین HTML و CSS
• 4. محیط توسعه: ویرایشگر کد
• 5. محیط توسعه: مرورگر وب
• 6. اولین استایل ها: تگ استایل
• 7. لینک کردن CSS خارجی
• 8. اینلاین استایل ها
• 9. انتخابگرهای اولیه: تگ ها
• 10. انتخابگرهای اولیه: کلاس ها
• 11. انتخابگرهای اولیه: آیدی ها
• 12. انتخابگرهای گروهی
• 13. خاصیت (Property) و مقدار (Value)
• 14. دستورات CSS: سینتکس
• 15. واحدها در CSS: پیکسل (px)
• 16. واحدها در CSS: درصد (%)
• 17. واحدها در CSS: واحد های نسبی (em, rem)
• 18. واحدها در CSS: واحد های viewport (vw, vh)
• 19. رنگ ها در CSS: نام رنگ ها
• 20. رنگ ها در CSS: کدهای هگزادسیمال (Hex)
• 21. رنگ ها در CSS: مقادیر RGB
• 22. رنگ ها در CSS: مقادیر RGBA (با شفافیت)
• 23. رنگ ها در CSS: مقادیر HSL
• 24. رنگ ها در CSS: مقادیر HSLA (با شفافیت)
• 25. پس زمینه (Background): رنگ پس زمینه
• 26. پس زمینه (Background): تصویر پس زمینه
• 27. پس زمینه (Background): تکرار تصویر پس زمینه (repeat, no-repeat)
• 28. پس زمینه (Background): موقعیت تصویر پس زمینه (position)
• 29. پس زمینه (Background): اندازه تصویر پس زمینه (size)
• 30. پس زمینه (Background): پیوست تصویر پس زمینه (attachment)
• 31. پس زمینه (Background): خصوصیت خلاصه background
• 32. تنظیم فونت (Font): فونت فمیلی (font-family)
• 33. تنظیم فونت (Font): انتخاب فونت های استاندارد
• 34. تنظیم فونت (Font): فونت های گوگل (Google Fonts)
• 35. تنظیم فونت (Font): وزن فونت (font-weight)
• 36. تنظیم فونت (Font): استایل فونت (font-style)
• 37. تنظیم فونت (Font): اندازه فونت (font-size)
• 38. تنظیم فونت (Font): ارتفاع خط (line-height)
• 39. تنظیم فونت (Font): فاصله بین حروف (letter-spacing)
• 40. تنظیم فونت (Font): فاصله بین کلمات (word-spacing)
• 41. تنظیم فونت (Font): تراز متن (text-align)
• 42. تنظیم فونت (Font): دکوراسیون متن (text-decoration)
• 43. تنظیم فونت (Font): تغییر حروف (text-transform)
• 44. تنظیم فونت (Font): تورفتگی متن (text-indent)
• 45. کادربندی (Box Model): محتوا (Content)
• 46. کادربندی (Box Model): پدینگ (Padding)
• 47. کادربندی (Box Model): بوردر (Border): ضخامت
• 48. کادربندی (Box Model): بوردر (Border): استایل
• 49. کادربندی (Box Model): بوردر (Border): رنگ
• 50. کادربندی (Box Model): بوردر (Border): خصوصیت خلاصه border
• 51. کادربندی (Box Model): مارجین (Margin)
• 52. نمایش (Display): نوع بلاک (block)
• 53. نمایش (Display): نوع اینلاین (inline)
• 54. نمایش (Display): نوع اینلاین-بلاگ (inline-block)
• 55. نمایش (Display): نوع فلکس باکس (flex)
• 56. نمایش (Display): نوع گرید (grid)
• 57. نمایش (Display): نوع نان (none)
• 58. نمایش (Display): نوع لیست-ایتِم (list-item)
• 59. چیدمان (Layout): پوزیشنینگ (Positioning): استاتیک (static)
• 60. چیدمان (Layout): پوزیشنینگ (Positioning): نسبی (relative)
• 61. چیدمان (Layout): پوزیشنینگ (Positioning): مطلق (absolute)
• 62. چیدمان (Layout): پوزیشنینگ (Positioning): ثابت (fixed)
• 63. چیدمان (Layout): پوزیشنینگ (Positioning): چسبان (sticky)
• 64. چیدمان (Layout): خصوصیات top, right, bottom, left
• 65. چیدمان (Layout): خصوصیت z-index
• 66. چیدمان (Layout): شناور سازی (Float): left
• 67. چیدمان (Layout): شناور سازی (Float): right
• 68. چیدمان (Layout): شناور سازی (Float): none
• 69. چیدمان (Layout): پاک کردن شناور سازی (Clearfix)
• 70. فلکس باکس (Flexbox): مفاهیم پایه (Container, Items)
• 71. فلکس باکس (Flexbox): خصوصیت display: flex
• 72. فلکس باکس (Flexbox): خصوصیت flex-direction
• 73. فلکس باکس (Flexbox): خصوصیت flex-wrap
• 74. فلکس باکس (Flexbox): خصوصیت justify-content
• 75. فلکس باکس (Flexbox): خصوصیت align-items
• 76. فلکس باکس (Flexbox): خصوصیت align-content
• 77. فلکس باکس (Flexbox): خصوصیت order (برای آیتم ها)
• 78. فلکس باکس (Flexbox): خصوصیت flex-grow (برای آیتم ها)
• 79. فلکس باکس (Flexbox): خصوصیت flex-shrink (برای آیتم ها)
• 80. فلکس باکس (Flexbox): خصوصیت flex-basis (برای آیتم ها)
• 81. فلکس باکس (Flexbox): خصوصیت flex (خلاصه آیتم ها)
• 82. فلکس باکس (Flexbox): خصوصیت align-self (برای آیتم ها)
• 83. CSS Grid: مفاهیم پایه (Container, Items)
• 84. CSS Grid: خصوصیت display: grid
• 85. CSS Grid: خصوصیت grid-template-columns
• 86. CSS Grid: خصوصیت grid-template-rows
• 87. CSS Grid: خصوصیت grid-gap
• 88. CSS Grid: خصوصیت justify-items
• 89. CSS Grid: خصوصیت align-items
• 90. CSS Grid: خصوصیت justify-content
• 91. CSS Grid: خصوصیت align-content
• 92. CSS Grid: خصوصیت grid-column
• 93. CSS Grid: خصوصیت grid-row
• 94. CSS Grid: خصوصیت grid-area
• 95. انتخابگرهای پیشرفته: انتخابگرهای ترکیبی (Descendant)
• 96. انتخابگرهای پیشرفته: انتخابگرهای فرزند مستقیم (Child)
• 97. انتخابگرهای پیشرفته: انتخابگرهای همسایه برادر (Adjacent Sibling)
• 98. انتخابگرهای پیشرفته: انتخابگرهای برادر عمومی (General Sibling)
• 99. انتخابگرهای پیشرفته: انتخابگرهای صفتی (Attribute Selectors)
• 100. انتخابگرهای پیشرفته: انتخابگرهای شبه کلاس (Pseudo-classes): hover