4 قسمت جدید به دوره آموزش VueJs و NuxtJs اضافه شد!

کلیک کنید
دوره آموزش CSS Grid

دوره آموزش CSS Grid

CSS Grid در واقع یکی از موضوعاتی است که اخیرا در بحث توسعه وب میتوان به آن اشاره می کنند. در اصل CSS دارای دو ابزاری کاربردی به نام های flexbox و CSS Grid میباشد که به توسعه دهنده کمک میکند تا با استفاده از CSS صفحات وب را به آسانی طراحی کنیم.

رایگان
شروع دوره: ۱۴۰۵/۳/۲۵ مدت زمان: 04:12
میزان پیشرفت 100%

زمان تقریبی

04:12

تعداد بازدید

۳٬۶۰۳ نفر

گواهینامه

در آپدیت آینده

مدت زمان04:12:00
وضعیتتکمیل شد
سطح دورهمقدماتی تا پیشرفته
جلسات14 جلسه
پشتیبانینامحدود
نحوه پشتیبانیتلگرام/تیکت

توضیحات دوره

دوره آموزش CSS Grid


CSS Gridیکی از موضوعاتی است که اخیرا بیشتر و بیشتر در بحث توسعه وب به آن اشاره می کنند.CSS یا Cascading Style Sheets به ما کمک می‌کند ظاهر مورد علاقه خود را برای سایت طراحی کنیم.در اصل CSS دارای دو ابزاری کاربردی به نام های flexbox و CSS grid میباشد که به توسعه دهنده وب سایت کمک میکند تا با استفاده از CSS صفحات وب را به آسانی و با سرعت بالا طراحی کنیم.

Layout در CSS

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

CSS Grid چیست ؟

طرح‌بندی CSS Grid یک سیستم شبکه‌ای دو بُعدی را برای CSS فراهم می‌کند. از این فضای مُشبک یا همان Grid می‌توان برای طرح‌بندی نواحی اصلی صفحه یا عناصر کوچک رابط کاربری استفاده کرد. یک Grid مجموعه‌ای از خط‌های افقی و عمودی متقاطع است که تعریف کننده سطرها و ستون‌ها هستند. می‌توان در داخل این سطرها و ستون‌ها عنصرهایی را قرار داد و جانمایی کرد.

از کدام یک باید استفاده کرد، گرید یا فلکس باکس؟

Grid نسبت به Flexbox‌ بسیار جدیدتر است. Grid می‌تواند کارهایی انجام دهد که Flexbox قادر به انجام آن‌ها نیست. در Flexbox نیز می‌توان کارهایی را انجام داد که در CSS Grid امکان‌پذیر نیستند. اما می‌توان از Flexbox و Grid به صورت همزمان استفاده کرد و از قابلیت‌های هر دوی آن‌ها بهره‌مند شد. در واقع یک آیتم Grid می‌تواند یک محفظه یا همان نگهدارنده Flexbox باشد. در ادامه آموزش CSS Grid ، توضیحات لازم در مورد مفاهیم بیان شده، نظیر نگهدارنده و آیتم Grid ارائه شده است.


یادگیری CSS Grid چقدر زمان می‌برد؟

به دلیل اینکه CSS Grid با هدف دست‌یابی به انعطاف‌پذیری بالا خلق شده است و برای کاربردها و موارد استفاده گوناگون و متعددی به کار گرفته می‌شود، نمی‌توان آن را به راحتی آموزش دید و از آن استفاده کرد. آموزش CSS Grid به صرف زمان کافی نیازمند است. در این دوره سعی شده مطالب مهم این تکنولوژی را با بیان مثال و در قالب پروژ] به صورت ساده بیان کنیم.

آیا CSS Grid ارزش یادگیری دارد؟

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


پیش نیازهای آموزش CSS Grid چیست؟

پیش از شروع آموزش CSS Grid باید آشنایی لازم با CSS و استایل‌دهی صفحه وب با استفاده از CSS کسب شده باشد. که ما یک دوره رایگان زبان CSS در آرتور قرار دادیم همچنین، با توجه به اینکه از CSS برای استایل‌دهی و قالب‌بندی نشانه‌گذاری‌های HTML استفاده می‌شود، باید با کدنویسی HTML نیز آشنایی کافی وجود داشته باشد که ما باز هم دوره رایگان و جامع HTML را در آرتور منتشر کردیم که میتونید استفاده کنید. به طور کلی HTML و CSS از جمله فناوری‌های بنیادی در حیطه طراحی و توسعه وب به شمار می‌روند و از اهمیت ویژه‌ای برخوردار هستند. به ویژه، برای درک مفاهیم و آموزش‌های ارائه شده در این مقاله، آشنایی با CSS ضرورت دارد. برای یادگیری CSS Grid یک بازی تحت وب نیز وجود دارد که در ادامه به معرفی آن پرداخته شده است.


آخرین اخبار و تخفیف های دوره های وب سایت آرتور را در پیج اینستاگرام آرتور دنبال کنید.

ابزار های استفاده شده در این دوره 

ویرایشگر phpstorm2021


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

1

معرفی دوره grid css

شامل ویدئو و صوت
10:57
2

کار با columns, row, gap

شامل ویدئو و صوت
19:52
3

کار با مفهوم grid-column, grid-row , fr

شامل ویدئو و صوت
15:29
4

کار با min-content و max-montent و تابع ()minmax

شامل ویدئو و صوت
15:26
5

کار با auto-fit و auto-fill

شامل ویدئو و صوت
16:15

نظرات دانشجویان

نظرات، پیشنهادات و تجربیات خود را با ما به اشتراک بگذارید

برای ثبت نظر وارد شوید

لطفاً برای ثبت نظر و مشاهده تجربیات دیگران وارد حساب کاربری خود شوید

دیدگاه‌های شما

در حال دریافت نظرات...

دوره رایگان

رایگان
تاریخ شروع:۱۴۰۵/۳/۲۵
آخرین بروزرسانی:۱۴۰۵/۵/۱۰
نوع دسترسی:مادام‌العمر
ظرفیت:نامحدود

پیش‌نیاز:

این دوره پیش‌نیازی ندارد

رضا کوهساری

رضا کوهساری

مدیر و مدرس آرتور

آشنایی من با دنیای برنامه نویسی از دوران دانشگاه آغاز شد و با ساخت اپلیکیشن های اندروید قدم به این مسیر گذاشتم، اما به تدریج شیفته طراحی وب شدم و اکنون بیش از ۸ سال است که در این حوزه فعالیت میکنم. در کنار توسعه، تدریس را نیز از ۵ سال پیش شروع کرده ام و تا امروز افتخار داشتم بیش از ۲ هزار ساعت آموزش آنلاین و ۲۵۰۰ ساعت آموزش حضوری را در کارنامه خود ثبت کنم و بیش از ۵ هزار دانشجو را در این مسیر همراهی کنم. حالا خوشحالم که میتوانم تمام این تجربیات چند ساله را در پلتفرم آموزش برنامه نویسی آرتور با شما به اشتراک بگذارم؛ چراکه خودم نیز همواره به یادگیری مطالب جدید علاقه مندم و معتقدم بهترین راه برای پیشرفت، همین همراهی و یادگیری دوطرفه است. مشتاقم که با همدیگر در این مسیر پیش برویم! 🚀