การใช้แท็ก th เพื่อกำหนดหัวตารางในแท็ก table ของ HTML

### การใช้แท็ก `<th>` เพื่อกำหนดหัวตารางในแท็ก `<table>` ของ HTML

ในภาษา HTML สำหรับการสร้างตาราง เราใช้แท็ก `<table>` เพื่อสร้างโครงสร้างพื้นฐานของตาราง แท็ก `<th>` (table header) เป็นส่วนสำคัญที่ช่วยกำหนดหัวข้อของคอลัมน์ในตาราง โดยช่วยให้ผู้ใช้สามารถเข้าใจข้อมูลในแต่ละคอลัมน์ได้ดียิ่งขึ้น

#### โครงสร้างของ HTML Table

การสร้างตารางเบื้องต้นใน HTML ประกอบด้วยแท็กหลักๆ ได้แก่ `<table>`, `<tr>`, `<th>`, และ `<td>` โดยมีรายละเอียดดังนี้:

- `<table>`: แท็กที่ใช้ในการสร้างตาราง

- `<tr>`: แท็กที่ใช้ในการสร้างแถวในตาราง

- `<th>`: แท็กที่ใช้ในการสร้างหัวข้อของคอลัมน์ (มักแสดงในตัวอักษรหนาและกลาง)

- `<td>`: แท็กที่ใช้ในการใส่ข้อมูลในเซลล์ของตาราง

#### ตัวอย่างการใช้งาน

ตัวอย่างต่อไปนี้จะแสดงให้เห็นถึงการใช้แท็ก `<th>` เพื่อกำหนดหัวตาราง:

```html

<!DOCTYPE html>

<html lang="th">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>ตัวอย่างตารางใน HTML</title>

</head>

<body>

<table border="1">

<tr>

<th>หมายเลข</th>

<th>ชื่อนักเรียน</th>

<th>คะแนน</th>

</tr>

<tr>

<td>1</td>

<td>สมชาย</td>

<td>85</td>

</tr>

<tr>

<td>2</td>

<td>สมศรี</td>

<td>90</td>

</tr>

<tr>

<td>3</td>

<td>สุชาติ</td>

<td>78</td>

</tr>

</table>

</body>

</html>

```

ในตัวอย่างข้างต้น:

- เราสร้างตารางที่มี 3 คอลัมน์ คือ "หมายเลข", "ชื่อนักเรียน", และ "คะแนน"

- แท็ก `<th>` ใช้ในการกำหนดหัวตาราง ซึ่งทำให้ผู้ใช้สามารถระบุข้อมูลในแต่ละคอลัมน์ได้อย่างชัดเจน

- แท็ก `<tr>` ใช้ในการสร้างแถวในตาราง และแต่ละแถวนั้นประกอบไปด้วยแท็ก `<td>` เพื่อแสดงข้อมูล

#### สรุป

การใช้แท็ก `<th>` เพื่อกำหนดหัวตารางใน HTML เป็นวิธีที่มีประสิทธิภาพในการจัดระเบียบข้อมูล ทำให้ผู้ใช้สามารถอ่านและเข้าใจข้อมูลได้ง่ายขึ้น การกำหนดหัวตารางอย่างเหมาะสมจะช่วยทำให้ตารางของคุณดูมีระเบียบและเข้าใจได้อย่างชัดเจนมากยิ่งขึ้น

แสดงความคิดเห็น

ใหม่กว่า เก่ากว่า
Python Game Programming Book