Thẻ th trong HTML là một trong những thẻ được sử dụng nhiều nhất khi lập trình web. Vậy cụ thể thẻ <th> được dùng để làm gì và những thuộc tính trong thẻ <th> có tác dụng gì? Mời các bạn cùng theo dõi bài viết dưới đây.
Mục lục
1. Thẻ th trong HTML được dùng để làm gì?
Thẻ th trong HTML là 1 trong 4 thẻ được sử dụng để viết nội dung của bảng trên các trang web. Nhiệm vụ của mỗi thẻ như sau:
- Thẻ table xác định phần tử là một cái bảng (gồm có các hàng và các ô). Cùng với thẻ div thì thẻ table thường được sử dụng để bố cục trang web.
- Thẻ th trong HTML xác định phần tử là một ô tiêu đề trong một hàng.
- Thẻ tr xác định phần tử là một hàng trong bảng.
- Thẻ td xác định phần tử là một ô trong bảng.
Ví dụ cách sử dụng thẻ th trong HTML để lập một bảng data như sau:
<table style=”width:100%”>
<tr>
<th>STT</th>
<th>Tên</th>
<th>Mã đơn hàng</th>
</tr>
<tr>
<td>001</td>
<td>Minh</td>
<td>122</td>
</tr>
<tr>
<td>002</td>
<td>Phương</td>
<td>233</td>
</tr>
</table>
Ta sẽ được một bảng như dưới đây
| STT | Tên | Mã đơn hàng |
| 001 | Minh | 122 |
| 002 | Phương | 233 |
2. Thẻ th trong HTML có các thuộc tính thường dùng nào
Thẻ <th> có 8 thuộc tính thường hay được sử dụng nhất bao gồm:
2.1. Thuộc tính align
Đây là thuộc tính dùng để căn lề nội dung của ô trong bảng theo chiều ngang. Thuộc tính align trong thẻ <th> gồm có 4 giá trị cơ bản bao gồm: left, right, center và justify (lần lượt là căn lề trái, căn lề phải, căn lề giữa và căn đều hai bên lề). Tương tự với thuộc tính align trong thẻ <th> thì ta có thể sử dụng text-align trong CSS.
2.2. Thuộc tính valign
Đây là thuộc tính giúp căn lề nội dung của ô trong bảng theo chiều dọc. Thuộc tính này gồm 3 giá trị cơ bản là top, bottom và middle (lần lượt là căn trên, căn dưới và căn đều chính giữa). Tương tự với thuộc tính valign, trong CSS ta có thể dùng thuộc tính vertical – align.
2.3. Thuộc tính colspan
Thuộc tính này xác định số lượng ô mà người dùng muốn gộp chung lại với nhau theo chiều ngang.
2.4. Thuộc tính rowspan
Xác định số lượng ô muốn gộp chung theo chiều dọc.
2.5. Thuộc tính width
Xác định chiều rộng của ô. Chú ý khi sử dụng thuộc tính này cần chọn đúng loại đơn vị đo. Có thể chọn px (pixel) hoặc tính theo % chiều rộng của phần tử cha của phần tử đang xác định thuộc tính.
2.6. Thuộc tính height
Xác định chiều cao của ô.
2.7. Thuộc tính bgcolor
Xác định màu nền (background color) của ô.
2.8. Thuộc tính nowrap
Xác định việc nội dung trong ô được hiển thị trên một dòng
Để xây dựng dữ liệu dạng bảng trong website, thẻ <th> là một thẻ không thể thiếu. Để sử dụng thẻ th trong HTML, bạn cần chú ý xác định đúng ô tiêu đề và các hàng trong bảng để viết câu lệnh cho chính xác. Tìm đọc các bài viết khác trên blog Got It Vietnam để tìm hiểu các kiến thức hữu ích liên quan.
