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ẻ
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ẻ
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.