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