رأس الجدول الذي يحتوي على عناوين الأعمدة.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Inline CSS Thead Example</title>
</head>
<body>
<table style="width: 80%; margin: 20px auto; border-collapse: collapse;">
<thead>
<tr style="background-color: #4CAF50; color: #fff;">
<th style="padding: 10px; border: 1px solid #ddd;">Column 1</th>
<th style="padding: 10px; border: 1px solid #ddd;">Column 2</th>
<th style="padding: 10px; border: 1px solid #ddd;">Column 3</th>
</tr>
</thead>
<tbody>
<tr>
<td style="padding: 10px; border: 1px solid #ddd;">Data 1</td>
<td style="padding: 10px; border: 1px solid #ddd;">Data 2</td>
<td style="padding: 10px; border: 1px solid #ddd;">Data 3</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td style="padding: 10px; border: 1px solid #ddd;">Data 4</td>
<td style="padding: 10px; border: 1px solid #ddd;">Data 5</td>
<td style="padding: 10px; border: 1px solid #ddd;">Data 6</td>
</tr>
</tbody>
</table>
</body>
</html>
| Column 1 | Column 2 | Column 3 |
|---|---|---|
| Data 1 | Data 2 | Data 3 |
| Data 4 | Data 5 | Data 6 |