خلاصه جلسه: ایجاد سطرها و ستون‌ها در CSS Grid

۱. تعریف Grid Layout

• فعال‌سازی Grid روی والد با:

   

  display: grid;
  

۲. ساخت ستون‌ها: grid-template-columns

• تعیین تعداد و اندازه ستون‌ها
• مقداردهی با px، %، fr، auto

• مثال کاربردی:

   

  grid-template-columns: 200px auto 40%;
  

۳. ساخت ردیف‌ها: grid-template-rows

• تعیین تعداد و اندازه ردیف‌ها

• مثال:

   

  grid-template-rows: auto auto auto auto;
  

۴. فاصله‌گذاری بین خانه‌ها

• column-gap: فاصله بین ستون‌ها
• row-gap: فاصله بین ردیف‌ها
• gap: تنظیم همزمان فاصله‌ها

• مثال:

   

  gap: 10px;