เคล็ดลับเครื่องมือสำหรับนักพัฒนาเว็บ: วิธีตรวจสอบตารางกริดใน CSS

Sofia Emelianova
Sofia Emelianova

เครื่องมือสำหรับนักพัฒนาเว็บใน Chrome ทำให้การแก้ไขข้อบกพร่องของเลย์เอาต์ตารางกริด CSS เป็นเรื่องง่ายด้วยตัวเลือกการแสดงภาพที่หลากหลาย

ดูวิดีโอเพื่อดูวิธีสลับการวางซ้อนตารางกริดในแผงองค์ประกอบและใช้เพื่อดำเนินการต่อไปนี้

ตารางกริดซ้อนทับ

  • แสดงภาพและตรวจสอบเลย์เอาต์ตารางกริด
  • ดูหมายเลขแถวและคอลัมน์ที่จะใช้อ้างอิงเมื่อวางรายการในตาราง
  • ใช้ชื่อเส้นและพื้นที่และแสดงบนการวางซ้อนหากคุณมีรายการในตารางกริดจำนวนมากและตัวเลขทำให้เกิดความสับสน
  • ตรวจสอบขนาดของแทร็ก

นอกจากนี้ เครื่องมือแก้ไขตารางกริดในแผงองค์ประกอบ > รูปแบบ คุณยังจัดแนวรายการและเนื้อหาในเลย์เอาต์แบบตารางกริดได้ด้วยการคลิกปุ่มแทนการพิมพ์กฎ CSS

เครื่องมือแก้ไขตารางกริด

ทำตามบทแนะนำตรวจสอบตารางกริด CSS เพื่อรับประสบการณ์การเรียนรู้แบบลงมือทำเพิ่มเติม