Cách tạo ô tiêu đề bảng (table heading) trong HTML?

Sử dụng thẻ <th> để tạo ô tiêu đề (header cell) trong bảng HTML. Khác với <td> (ô dữ liệu), <th> mặc định in đậm và căn giữa, dùng cho hàng tiêu đề cột hoặc hàng.

Các thuộc tính của thẻ <th>

Thuộc tính	Giá trị	Mô tả
abbr	abbreviated_text	Deprecated – Phiên bản rút gọn nội dung ô tiêu đề.
align	right, left, center, justify, char	Deprecated – Căn chỉnh nội dung trong ô.
axis	Name	Deprecated – Danh mục cho ô th.
bgcolor	rgb(x,x,x), #hexcode, colorname	Deprecated – Màu nền ô tiêu đề.
char	Character	Deprecated – Ký tự căn chỉnh (align="char").
charoff	pixels hoặc %	Deprecated – Độ lệch căn chỉnh.
colspan	Number	Số cột mà ô tiêu đề trải qua.
headers	Id	ID của một hoặc nhiều ô tiêu đề liên quan.
height	Pixels	Deprecated – Chiều cao ô.
nowrap	Nowrap	Deprecated – Ngăn xuống dòng tự động.
rowspan	Number	Số hàng mà ô tiêu đề trải qua.
scope	col, colgroup, row, rowgroup	Xác định phạm vi ô tiêu đề áp dụng (quan trọng cho truy cập).
valign	top, middle, bottom, baseline	Deprecated – Căn chỉnh dọc.
width	pixels hoặc %	Deprecated – Chiều rộng ô.

Ví dụ

<!DOCTYPE html>
<html>
  <head>
    <style>
      table, th, td { border: 1px solid black; border-collapse: collapse; padding: 8px; }
    </style>
  </head>
  <body>
    <h3>Kết quả</h3>
    <table>
      <tr>
        <th>Điểm</th>
        <th>Học sinh</th>
      </tr>
      <tr>
        <td>600</td>
        <td>Amit</td>
      </tr>
      <tr>
        <td>400</td>
        <td>Anil</td>
      </tr>
    </table>
  </body>
</html>

Mẹo

Luôn dùng thuộc tính scope (ví dụ: scope="col") để cải thiện khả năng truy cập (accessibility) cho người dùng đọc màn hình.