จากแนวทางปฏิบัติล่าสุดของฉันและหลังจากสื่อสารกับผู้อ่านบางคนเกี่ยวกับการใช้ตาราง HTML ฉันจึงตัดสินใจเขียนบทความนี้ โดยทั่วไป ฉันสังเกตเห็นว่าพวกเขามีความรังเกียจในการใช้ตารางเนื่องจากมีข้อมูลที่ทำให้เข้าใจผิด จริงๆ แล้วหลายๆ คนจะบอกว่า "ผมเห็นว่าตารางไม่ควรใช้" แต่นี่มันผิดอย่างสิ้นเชิง! คำแนะนำนี้ใช้ได้กับการใช้ตาราง HTML เพื่อกำหนดโครงร่างของเว็บเพจเท่านั้น แต่ตารางเหมาะสำหรับการจัดเรียงแถวและคอลัมน์ของข้อมูลได้อย่างสะดวก และหากคุณต้องแสดงข้อมูลแบบตารางบนเพจ คุณต้องใช้ข้อมูลเหล่านั้น! ทำไมไม่? อย่างไรก็ตาม ในกรณีนี้ บางคนเพิกเฉยต่อการมีอยู่ของแท็ก HTML บางตัวสำหรับตาราง และไม่รู้วิธีใช้อย่างถูกต้อง -
HTML มีแท็กที่เกี่ยวข้องกับตาราง 10 แท็ก ด้านล่างนี้เป็นรายการพร้อมคำแนะนำ แต่ก่อนอื่น เอกสารจะต้องถูกกำหนดอย่างถูกต้องภายใต้ HTML 4.01/XHTML 1 หรือ HTML 5:
<caption> กำหนดชื่อตาราง (4, 5)
<col> กำหนดคุณลักษณะสำหรับคอลัมน์ตาราง (4, 5)
<colgroup> กำหนดการจัดกลุ่มของคอลัมน์ตาราง (4, 5)
<table> กำหนดตาราง (4, 5)
<tbody> กำหนดเนื้อหาของตาราง (4, 5)
<td> กำหนดเซลล์ (4, 5)
<tfoot> กำหนดเชิงอรรถ (ด้านล่าง) ของตาราง (4, 5)
<th> กำหนดส่วนหัวของตาราง (4, 5)
<thead> กำหนดส่วนหัวของตาราง (4, 5)
<tr> กำหนดแถวของตาราง (4, 5)
โครงสร้างพื้นฐานของตารางมีดังนี้:
ประกอบด้วยชื่อเรื่อง ส่วนหัว เนื้อหา และส่วนท้าย ลำดับที่ถูกต้องขององค์ประกอบ HTML คือ:
<ตาราง>
<คำบรรยายภาพ>
<หัว>
<tเท้า>
<tbody>
คุณยังสามารถใช้ <col> และ <colgroup> เพื่อกำหนดคอลัมน์ของตารางหรือคอลัมน์กลุ่ม:
<ตาราง>
<คำบรรยายภาพ>
<คอลกรุ๊ป>
<คอล>
<หัว>
<tเท้า>
<tbody>