Tạo bảng biểu với thẻ table

Cấu trúc table

Để tạo bảng biểu trong HTML chúng ta dùng các thẻ thuộc nhóm thẻ table như sau:

• Thẻ <table> dùng để khai báo một bảng biểu.
• Thẻ <tr> dùng để khai báo dòng.
• Thẻ <td> dùng để khai báo các cột trong một dòng.
• Thẻ <th> dùng để khai báo tiêu đề cho bảng biểu.
• Thẻ <thead> khai báo nhóm tiêu đề.
• Thẻ <tbody> khai báo nhóm nội dung trong bảng.
• Thẻ <tfoot> khai báo nhóm chân bảng.
• Thẻ <caption> khai báo chú thích cho bảng.
• Thẻ <colgroup> chỉ định một hoặc nhiều cột để định dạng.
• Thẻ <col> chỉ định thuộc tính cột cho từng cột trong phần tử <colgroup>.

Ví dụ một bảng:

<table>
	<tr>
		<th>STT<th>
		<th>Ngôn ngữ</th>
		<th>Mô tả</th>
	</tr>
	</tr>
		<td>1</td>
		<td>HTML</td>
		<td>Hyper Text Markup Language</td>
	</tr>
	<tr>
		<td>2</td>
		<td>CSS</td>
		<td>Cascading Style Sheets</td>
	</tr>
</table>

Phần tử td

<td> (table data) là phần tử thấp nhất chứa dữ liệu của bảng

Phần tử tr

<tr> (table row) dùng để nhóm các thẻ td thành một dòng.

Phần tử th

Tương tự như <td> , <th> nằm trong thẻ <tr> dùng để đánh dấu tiêu đề của một nhóm ô bảng.

Phần tử table

Bảng là một cấu trúc khả phức tạp, nội dung của bản được đặt trong thẻ <table>.

Một bảng bao gồm một phần tử <table> và một hoặc nhiều phần tử <tr>, <td>, <th>.

Thẻ <tr> định nghĩa một dòng , <td> định nghĩa một ô của bảng, <th> định nghĩa đề mục của bảng.

Ngoài ra một bảng cũng có thể chứa các phần tử <thead>, <tbody>, <tfoot>, <caption>, <colgroup>, <col>

Thuộc tính border

Trong <table> có thuộc tính border định nghĩa độ rộng của các dòng kẻ của bảng (hiện nay nên dùng CSS), độ rộng của đường kẻ được tính bằng đơn vị px nếu giá trị bằng 0 thì bảng không có đường kẻ.