Bài tập

Table trong HTML - Tạo bảng dữ liệu dễ dàng và linh hoạt

Huy Erick

Bạn đã bao giờ muốn hiển thị dữ liệu theo kiểu hàng và cột một cách dễ dàng và linh hoạt trong một trang web của mình chưa? Với Table trong HTML, bạn có thể...

Bạn đã bao giờ muốn hiển thị dữ liệu theo kiểu hàng và cột một cách dễ dàng và linh hoạt trong một trang web của mình chưa? Với Table trong HTML, bạn có thể tạo bảng dữ liệu một cách đơn giản và nhanh chóng.

Hướng dẫn tạo table trong HTML

Để tạo một bảng trong HTML, bạn sử dụng thẻ

mở và đóng. Bên trong thẻ
, dữ liệu được sắp xếp thành các hàng và cột bằng cách sử dụng thẻ cho hàng và thẻ cho cột.

Ví dụ, để tạo một bảng có 2 hàng và 3 cột, bạn chỉ cần:

Column 1 Column 2 Column 3
Column 1 Column 2 Column 3

Nếu bạn muốn thêm một hàng mới, chỉ cần thêm thẻ vào cuối bảng:

Column 1 Column 2 Column 3
Column 1 Column 2 Column 3
Column 1 Column 2 Column 3

Để thêm một cột mới, bạn chỉ cần thêm thẻ vào mỗi hàng:

Column 1 Column 2 Column 3 Column 4
Column 1 Column 2 Column 3 Column 4
Column 1 Column 2 Column 3 Column 4

Thêm đường viền cho table trong HTML

Nếu bạn muốn thêm đường viền cho bảng trong HTML, bạn có thể sử dụng CSS. Tuy nhiên, nếu bạn muốn làm điều đó nhanh chóng, bạn có thể thêm thuộc tính border trong thẻ

. Ví dụ:
Row 1 Row 2 Row 3
Row 1 Row 2 Row 3

Thêm tiêu đề vào hàng và cột cho table trong HTML

Thêm tiêu đề vào hàng và cột cho bảng trong HTML giúp cho bảng trở nên dễ đọc hơn. Tiêu đề bảng được tự động tạo kiểu văn bản in đậm và căn giữa để phân biệt chúng một cách trực quan với dữ liệu bảng. Đồng thời, tiêu đề cũng giúp cho bảng dễ truy cập hơn cho các công cụ hỗ trợ đọc màn hình.

Để thêm tiêu đề cột, bạn thêm một thẻ mới vào đầu bảng và sử dụng thẻ cho tiêu đề cột:

Column Header 1 Column Header 2 Column Header 3
Row Header 1 Data Data Data
Row Header 2 Data Data Data
Row Header 3 Data Data Data

Kết luận: Table trong HTML

Trên đây là hướng dẫn chi tiết về cách tạo bảng trong HTML. Hãy nhớ áp dụng đúng các thuộc tính và thực hiện đúng các bước để tạo bảng trong HTML một cách dễ dàng và linh hoạt. Sử dụng Table trong HTML để hiển thị dữ liệu theo kiểu hàng và cột sẽ giúp trang web của bạn trở nên trực quan và dễ sử dụng hơn bao giờ hết.

1