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

Sofia Emelianova
Sofia Emelianova

เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ของ Chrome ช่วยแก้ไขข้อบกพร่องของเลย์เอาต์ตารางกริด CSS ได้อย่างง่ายดายด้วยตัวเลือกการแสดงภาพต่างๆ

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

การวางซ้อนตารางกริด

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

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

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

หากต้องการเรียนรู้แบบลงมือทำ ให้ทำตามบทแนะนำตรวจสอบตาราง CSS