Cách dùng CSV & Excel sang Bảng HTML
- Dán ô CSV hoặc Excel, mở tệp
.csv,.xlsxhoặc.json, hoặc tải dữ liệu mẫu. - Chọn kiểu dáng: HTML thuần, CSS có sẵn hoặc class Bootstrap, và thêm tên class riêng nếu cần.
- Bật hoặc tắt
<thead>, escape HTML, xử lý xuống dòng và thu gọn mã. - Kiểm tra phần xem trước, sau đó sao chép mã hoặc tải xuống.
Công cụ tạo bảng HTML là gì?
Công cụ tạo bảng HTML chuyển các hàng dữ liệu thành mã <table> mà bạn có thể dán vào trang web, CMS, email hoặc tài liệu. Viết tay mã này vừa chậm vừa dễ sai: mỗi ô cần thẻ riêng và ký tự đặc biệt phải được escape. Công cụ này làm tất cả trong một bước từ CSV, ô Excel hoặc JSON.
Mã ngữ nghĩa, dễ tiếp cận
Dòng tiêu đề trở thành <thead> với các ô <th scope="col">, còn dữ liệu nằm trong <tbody>. Trình đọc màn hình dùng các thẻ này để đọc tên cột cho từng ô, và trình duyệt lặp lại <thead> trên mỗi trang khi in. Thẻ <caption> tùy chọn giúp bảng có tên dễ tiếp cận.
<table class="data-table">
<thead>
<tr>
<th scope="col">name</th>
<th scope="col">plan</th>
</tr>
</thead>
<tbody>
<tr>
<td>Ada Lovelace</td>
<td>pro</td>
</tr>
</tbody>
</table>Vì sao cần escape
Khi bật Escape HTML trong ô (mặc định), các ký tự như <, >, & và " được chuyển thành thực thể, nên giá trị như <b> hiển thị dưới dạng chữ thay vì làm thay đổi trang. Chỉ tắt tùy chọn này khi ô của bạn cố ý chứa HTML đáng tin cậy như liên kết. Phần xem trước chạy trong khung cách ly với script bị vô hiệu hóa.
Tùy chọn kiểu dáng
| Kiểu dáng | Bạn nhận được gì |
|---|---|
| HTML thuần | Mã trần, kế thừa CSS của trang bạn |
| CSS có sẵn | Một khối <style> nhỏ: viền, nền tiêu đề, dòng xen kẽ, số căn phải |
| Bootstrap | Class table table-striped table-bordered cho trang Bootstrap 4/5 |
Với nội dung rich text của Webflow và các trang dùng Markdown, bảng Markdown có thể đơn giản hơn. Để chuyển bảng HTML có sẵn sang Markdown, hãy dùng HTML sang Markdown.
Cũng được tìm dưới tên: csv sang html, excel sang bảng html, tạo bảng html, chuyển csv sang bảng html, json sang bảng html, bảng html từ excel.
Các công cụ dùng kèm tốt với CSV & Excel sang Bảng HTML
- Tạo Select Menu — Đừng gõ tay từng danh sách lựa chọn nữa.
- Định dạng HTML — Dán mã HTML đã nén hoặc lộn xộn và nhận lại HTML được thụt lề rõ ràng, nhất quán — bao gồm cả các khối <style> và <script> nhúng bên trong.
- Markdown sang HTML — Viết hoặc dán Markdown để nhận HTML sạch ngay lập tức, kèm bản xem trước đã được làm sạch, bảng GitHub-flavored, danh sách việc cần làm và khối code có rào chắn.
- Excel sang JSON — Mở file .xlsx hoặc dán trực tiếp các ô từ Excel hay Google Sheets để nhận JSON sạch.
Câu hỏi thường gặp
Làm sao chuyển bảng Excel sang HTML?
Ô có thể chứa liên kết hoặc HTML khác không?
Bảng có responsive không?
overflow-x:auto, cách mà hầu hết các framework responsive thường dùng.