تخفیف ویژه همین الان — دوره‌های تخفیف‌دار را ببینید.
روز
:
ساعت
:
دقیقه
:
ثانیه
تخفیف‌های ویژه
دوره آموزشی CSS: طرح‌بندی‌های پیشرفته با Grid

دوره آموزشی CSS: طرح‌بندی‌های پیشرفته با Grid

2 ساعت 28 دقیقهپیشرفته2024-11-20

مدرسین

Carrie Dils

Carrie Dils

Development, WordPress

جزئیات دوره

این دوره یک مرور مختصر درباره ماژول چیدمان شبکه (CSS Grid) ارائه می‌دهد و زمینه‌ای برای استفاده از آن در کنار یا به جای روش‌های سنتی‌تر چیدمان فراهم می‌کند. همچنین نمونه‌های کاربردی از پنج الگوی شبکه رایج که برای چیدمان‌های مدرن وب استفاده می‌شوند، ارائه می‌گردد. مربی کری دیلز مفاهیم اصلی CSS Grid را بررسی کرده، نشان می‌دهد چگونه با استفاده از آن به چیدمان‌های دلخواه دست پیدا کنید، نمونه‌های کاربردی از استفاده از CSS Grid ارائه می‌کند و همچنین چیدمان‌های واکنش‌گرا را با CSS Grid نشان می‌دهد.

اهداف یادگیری:
تعریف CSS Grid به همراه اصطلاحات و ویژگی‌های آن.
استفاده از ابزارهای مرورگر برای کمک به ساخت چیدمان‌های شبکه‌ای.
ایجاد الگوهای رایج شبکه برای چیدمان کلی وب‌سایت و چیدمان اجزای منفرد.

مهارت ها

Responsive Web DesignCSSWeb StandardsWeb DesignWeb Development ToolsFront-End Web DevelopmentWeb DevelopmentOpen SourceOne-Off

سرفصل ها

0. مقدمه

  • 01 - به CSS Grid خوش آمدید
  • 02 - آنچه باید بدانید
  • 03 - استفاده از GitHub Codespaces با این دوره

1. CSS Grid - مفاهیم اصلی

  • 04 - CSS Grid چیست
  • 05 - اصطلاحات شبکه
  • 06 - یک شبکه ایجاد کنید
  • 07 - خطوط و واحدهای شبکه
  • 08 - قرار دادن اقلام شبکه
  • 09 - مناطق شبکه
  • 10 - خطوط شبکه نامگذاری شده
  • 11 - شکاف شبکه
  • 12 - تراز شبکه

2. برنامه ریزی برای طرح بندی شبکه

  • 13 - چه زمانی از Grid استفاده کنیم
  • 14 - طراحی چیدمان با قلم و کاغذ
  • 15 - استفاده از ژنراتورهای Grid
  • 16 - رویکرد اول موبایل
  • 17 - ملاحظات دسترسی

3. طرح چند ستونی

  • 18 - چیزی که شما ایجاد می‌کنید - یک طرح چند ستونی
  • 19 - مروری بر نقطه شروع
  • 20 - شبکه اصلی را ایجاد کنید
  • 21 - قرار دادن آیتم‌های شبکه ای به صورت دستی
  • 22 - ستون سوم را برای نمای گسترده‌تر اضافه کنید
  • 23 - شبکه را توجیه کنید
  • 24 - پاداش - Refactor با استفاده از مناطق شبکه

4. Full-Bleed Layout

  • 25 - چیزی که شما ایجاد می‌کنید - یک طرح بندی کامل
  • 26 - مروری بر نقطه شروع
  • 27 - شبکه مشترک را ایجاد کنید
  • 28 - ستون‌ها و موارد شبکه موقعیت را تعریف کنید

5. طرح بندی کارت بسیار یکنواخت

  • 29 - چیزی که شما ایجاد می‌کنید - یک طرح کارت یکنواخت
  • 30 - نمای کلی از نشانه گذاری کارت و سبک‌های شروع
  • 31 - شبکه اصلی را تعریف کنید
  • 32 - برای هر کارت شبکه ایجاد کنید

6. طرح بندی کارت متغیر

  • 33 - چیزی که شما ایجاد می‌کنید - طرح بندی کارت متغیر
  • 34 - مروری بر نشانه گذاری کارت
  • 35 - شبکه اصلی را تعریف کنید
  • 36 - کارت‌ها را روی شبکه قرار دهید
  • 37 - برای هر کارت شبکه ایجاد کنید
  • 38 - موارد را در داخل شبکه کارت قرار دهید
  • 39 - مطمئن شوید که پاسخگو باشد

7. چیدمان نامتقارن یا شکسته

  • 40 - چیزی که شما ایجاد می‌کنید - یک طرح نامتقارن
  • 41 - مروری بر نقطه شروع
  • 42 - طرح شبکه اولیه را تعریف کنید
  • 43 - اولین شبکه تو در تو را ایجاد کنید
  • 44 - دومین شبکه تودرتو ایجاد کنید

نتیجه گیری

  • 45 - مراحل بعدی

دوره های مرتبط

درباره ما

لینداکده یک بستر یادگیری پیشرو است که به افراد کمک می کند تا کسب و کار ، نرم افزار ، فناوری و مهارت‌های خلاقانه را برای دستیابی به اهداف شخصی و حرفه ای بیاموزد.

شماره تلفنکانال آپاراتپشتیبانی تلگرامکانال تلگرامپیج اینستاگرام

کلیه‌ی حقوق این سایت متعلق به لینداکده می باشد

قوانین و شرایط|حریم خصوصی

نماد الکترونیک enamad در صورت اتصال با آی‌پی داخل کشور، نمایش داده خواهد شد.
logo-samandehi - لوگو ساماندهی
zarinpal
zibal