توضیحات

دوستان این دوره بازتولید شده (با کیفیت و محتوای بهتر) دوره قبلی (آموزش Grid Layout پروژه محور) در سایت هست که میتوانید از این دوره استفاده کنید.

در دنیای HTML و CSS که نمایش محتوا را به عهده دارند همیشه یک موضوع, سختی و پیچیدگی خاص خود را داشته و آن هم صفحه آرایی است.در گذشته برای صفحه آرایی از Float که به وسیله تکنیک Clearfix حل می شود استفاده میکردیم.تا اینکه CSS 3 ماژولی برای صفحه آرایی دارد که نه تنها مشکلات قبلی را کنار می زند بلکه ویژگی های بسیار چشم گیر و کاربردی را فراهم می کند. این ماژول Flexible Box یا Flexbox نام دارد.بعد از فلکس باکس ماژول دیگری نیز برای صفحه آرایی معرفی شد به نام  CSS Grid  (سی اس اس گرید) که باعث شد تا قدرت ما در صفحه آرایی بیشتر شود و در کنار فلکس باکس بتوانیم برای چیدمان اجزا صفحه از آن نیز استفاده کنیم.گرید توانایی های جدیدی برای ما دارد که از مهمترین آنها می توان به مدیریت صفحه آرایی در دو بعد افقی و عمودی به صورت همزمان اشاره کرد.

حتما ویدیو معرفی دوره را در پایین مشاهده کنید تا با دوره و پروژه ای انتهای دوره آشنا شوید.

مباحثی که در این دوره گفته میشود شامل :
آشنایی با CSS Grid (سی اس اس گرید)

  • معرفی و آشنایی با css grid (گرید)
  • پراپرتی های grid-template-columns و grid-template-rows
  • واحد ها و fr (fraction)
  • پراپرتی gap
  • پراپرتی های grid-column و grid-row
  • پراپرتی grid-template-areas
  • تابع repeat و پراپرتی order
  • پراپرتی های justify-content و align-content
  • پراپرتی های justify-items و align-items
  • پراپرتی های justify-self و align-self
  • تابع minmax
  • مقادیر auto-fill و auto-fit

پروژه دوره

  • معرفی پروژه و افزودن متغیرها های css، استایل های عمومی، فونت و آیکون
  • ایجاد favicon برای پروژه
  • بخش header (هدر)
  • بخش navbar
  • بخش sidebar
  • بخش درباره ما
  • بخش خدمات ما
  • بخش پروژه ها
  • بخش تماس با ما
  • بخش مهارت ها
  • بخش timeline
  • بخش مقالات
  • بخش footer (فوتر)
  • افزودن browser prefixes
  • آپلود پروژه روی سرور (deploy)

پیش نیاز های این دوره فوق العاده کاربردی:

دوره های پیشنهادی، بعد از گذراندن این دوره :


HTML CSS طراحی وب grid سی اس اس اچ تی ام ال css 3 html 5 سی اس اس گرید گرید css grid

مدرس دوره علی شیخ
مدت دوره 05:06:22
تعداد ویدیو 40

وضعیت دوره : کامل شده
قیمت دوره : رایگان

نظرات ارزشمند شما:

برای ارسال نظر ابتدا باید وارد سایت شوید

  • سلام. آموزش این دوره هم مثل دوره های گذشته بسیار عالی بود و پر از نکات کاربردی. ممنون از تلاش های شما.
    یک سوال:
    ما اگر بخواهیم فایل های تمرینی شما یا خودمان را در گوشی موبایل مشاهده کنیم چگونه باید این کار رو انجام بدهیم؟

    • سلام وقت بخیر.
      ممنون از شما و حمایتتون
      شما باید نرم افزار rar برای اکسترک و یک ادیتور که حالا توی کافه بازار یا برنامه های که نرم افزار برای دانلود هست روی گوشی داشته باشید.

  • درود برشما رفیق میخواستم بدونم شما وقتی یک پروزه رو طراحی کردید بعدش چطوری مدیریتش میکنید از ورد پرس استفاده نمیکنید ؟؟؟؟ اگه بخوایم از ورد پرس استفاده نکنیم چطوری مدیرتش کنیم عکس عوض کنیم متن عوض کنیم

    • سلام وقت بخیر.
      یک سایت دیگه به اسم پنل ادمین طراحی میشه که فقط ادمین های سایت بهش دسترسی دارند که از زبان بک اند هم طبیعتا استفاده میشه که بتوان به دیتابیس وصل شد و اطلاعات ذخیره و بازیابی کرد
      حالا توی پنل ادمین کارهای مختلف انجام میشه

  • شما در درس "grid-template-areas" گفتی برا اینکه هدر و فوتر کل عرضو بگیرن سه بار نوشتیش...مگه نباید 1 بار بنویسی که کل عرضو بگیرن؟
    یعنی ما همیشه باید برا اینکه یه عنصری کل عرضو بگیره همیشه بر اساس تعداد بیشترین ستونایی که میخاییم بنویسیمش؟

    • سلام وقت بخیر.
      شما براساس تعداد سطر و ستونی که مشخص کردید مقادیر را بر اساس همون تعداد مشخص میکنید.

  • تشکر از شما بابت ارائه این دوره عالی
    باوجود اینکه دوره درمورد گرید هست ولی مطالب مهم دیگه ای هم گفتین که برای من خیلی مفید بود
    خوشحالم که یه سایت خوب برای یادگیری پیدا کردم

    • سلام وقت بخیر.
      ممنون از شما و حمایتتون?
      خداروشکر دوره براتون مفید بوده