Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

วิธีสร้างหัวข้อตาราง (Table Heading) ใน HTML

ใช้แท็ก <th> ใน HTML เพื่อสร้างหัวข้อตาราง แท็ก HTML <th> ใช้สำหรับระบุเซลล์หัวข้อหรือหัวตารางภายในตาราง ข้อความใน <th> จะแสดงหนา (bold) และจัดกึ่งกลางโดยค่าเริ่มต้น

แอตทริบิวต์ของ <th>

แอตทริบิวต์ ค่า คำอธิบาย
abbr abbreviated_text Deprecated - ระบุเวอร์ชันย่อของเนื้อหาในเซลล์หัวข้อ
align right, left, center, justify, char Deprecated - การจัดตำแหน่งเนื้อหาในเซลล์หัวข้อ
axis Name Deprecated - ระบุหมวดหมู่สำหรับ th นี้
bgcolor rgb(x,x,x), #hexcode, colorname Deprecated - ระบุสีพื้นหลังของเซลล์หัวข้อ
char Character Deprecated - ระบุตัวอักษรจัดตำแหน่ง ใช้เมื่อ align="char"
charoff pixels หรือ % Deprecated - ระบุออฟเซ็ตการจัดตำแหน่ง
colspan Number ระบุจำนวนคอลัมน์ที่เซลล์หัวข้อกลับครอบคลุม
headers Id ระบุเซลล์หัวข้อหนึ่งหรือมากกว่าที่เซลล์เกี่ยวข้อง
height Pixels Deprecated - ระบุความสูงของเซลล์หัวข้อ
nowrap Nowrap Deprecated - ป้องกันการขึ้นบรรทัดใหม่อัตโนมัติ
rowspan Number ระบุจำนวนแถวที่เซลล์หัวข้อกลับครอบคลุม
scope col, colgroup, row, rowgroup ใช้บนเซลล์หัวข้อ ระบุเซลล์ที่จะใช้ข้อมูลหัวข้อนี้
valign top, middle, bottom, baseline Deprecated - การจัดตำแหน่งแนวตั้ง
width pixels หรือ % Deprecated - ระบุความกว้างของเซลล์หัวข้อ

หมายเหตุ: แอตทริบิวต์ที่เครื่องหมาย Deprecated ควรใช้ CSS แทน

ตัวอย่าง

คุณสามารถลองรันโค้ดต่อไปนี้เพื่อเรียนรู้วิธีสร้างหัวข้อตารางใน HTML:

<!DOCTYPE html> 
<html> 
  <head> 
    <style> 
      table, th, td { 
        border: 1px solid black; 
      } 
    </style> 
  </head> 
  <body> 
    <h3>ผลลัพธ์</h3> 
    <table> 
      <th>คะแนน</th> 
      <th>นักเรียน</th> 
      <tr> 
        <td>600</td> 
        <td>อามิต</td> 
      </tr> 
      <tr> 
        <td>400</td> 
        <td>อานิล</td> 
      </tr> 
    </table> 
  </body> 
</html>