แท็ก table

แท็ก table สร้างตาราง ใช้ ร่วมกับแท็ก tr, td, th

แท็ก tr สร้างแถวของตาราง ส่วนแท็ก td และ th สร้างเซลล์ของ ตารางนี้ ความแตกต่างระหว่าง td และ th: อันแรกคือเซลล์ธรรมดา ส่วนอันที่สองคือ เซลล์หัวข้อ

แอตทริบิวต์

แอตทริบิวต์ คำอธิบาย
cellspacing กำหนดระยะห่างระหว่างเซลล์
ล้าสมัยแล้ว แทนที่จะใช้ควรใช้ คุณสมบัติ CSS border-spacing
cellpadding กำหนดระยะห่างระหว่างข้อความกับขอบเซลล์
ล้าสมัยแล้ว แทนที่จะใช้ควรใช้ คุณสมบัติ CSS padding
border กำหนดขอบของเซลล์และตาราง
ล้าสมัยแล้ว แทนที่จะใช้ควรใช้ คุณสมบัติ CSS border

ตัวอย่าง

มาสร้างตารางด้วยเซลล์ th และ td กัน:

html<table>
  <tr>
    <th>ชื่อ</th>
    <th>นามสกุล</th>
    <th>เงินเดือน</th>
  </tr>
  <tr>
    <td>name1</td>
    <td>surn1</td>
    <td>200$</td>
  </tr>
  <tr>
    <td>name2</td>
    <td>surn2</td>
    <td>1000$</td>
  </tr>
</table>
csstable, td, th {
  border: 1px solid black;
}

Результат:

ดูเพิ่มเติม

  • แท็ก thead, tbody และ tfoot,
    ซึ่งจัดกลุ่มแถวของตาราง
  • แท็ก caption,
    ซึ่งกำหนดหัวข้อของตารางทั้งหมด
  • คุณสมบัติ vertical-align,
    ซึ่งกำหนดการจัดตำแหน่งข้อความในแนวตั้ง
  • แอตทริบิวต์ rowspan และ colspan,
    ซึ่งรวมแถวและคอลัมน์ของตาราง