Tạo bảng thông tin bằng HTML – hướng dẫn chi tiết và dễ hiểu

Bạn muốn hiển thị danh sách sản phẩm, bảng giá, hoặc thời khóa biểu trên website? HTML cung cấp thẻ <table> để tạo bảng thông tin một cách rõ ràng và có tổ chức. Bài viết này sẽ hướng dẫn bạn cách tạo bảng, và cách thêm tiêu đề cột, dòng, dữ liệu…

---

1. Cấu trúc cơ bản của bảng

Một bảng HTML bao gồm các thẻ:

• <table>: Khung chính của bảng
• <tr>: Một dòng
• <th>: Ô tiêu đề
• <td>: Ô dữ liệu

<table border="1">
  <tr>
    <th>Tên</th>
    <th>Email</th>
  </tr>
  <tr>
    <td>Nguyễn Văn A</td>
    <td>a@gmail.com</td>
  </tr>
</table>

---

2. Mẹo trình bày bảng đẹp

• Thêm border để tạo đường viền
• Dùng <thead>, <tbody>, <tfoot> để chia phần đầu/cuối nếu bảng lớn
• Kết hợp với CSS để làm bảng responsive, dễ nhìn

---

Lời kết:

Bảng HTML giúp bạn hiển thị dữ liệu có cấu trúc rất hiệu quả. Dù đơn giản nhưng nếu biết kết hợp với CSS thì bảng sẽ đẹp, dễ dùng và chuyên nghiệp.

Bài tiếp theo: Một số mẹo hay khi viết HTML giúp bạn tiết kiệm thời gian và viết code sạch hơn!