Cara menggunakan CSV & Excel ke Tabel HTML
- Tempel sel CSV atau Excel, buka file
.csv,.xlsxatau.json, atau muat contohnya. - Pilih gaya: markup polos, CSS bawaan, atau kelas Bootstrap, lalu tambahkan nama kelas sendiri jika perlu.
- Aktifkan atau nonaktifkan
<thead>, escape HTML, penanganan baris baru, dan minifikasi. - Periksa pratinjau hasilnya, lalu salin markup-nya atau unduh.
Apa itu generator tabel HTML?
Generator tabel HTML mengubah baris data menjadi markup <table> yang bisa kamu tempel ke halaman web, CMS, email, atau dokumentasi. Menulis markup itu secara manual memakan waktu dan rawan salah, karena setiap sel butuh tag sendiri dan karakter khusus harus di-escape. Alat ini melakukannya dari CSV, sel Excel, atau JSON hanya dalam satu langkah.
Markup yang semantik dan mudah diakses
Baris header menjadi <thead> dengan sel <th scope="col">, sedangkan datanya masuk ke <tbody>. Screen reader memakai elemen ini untuk membacakan nama kolom di setiap sel, dan browser mengulang <thead> di setiap halaman cetak. <caption> opsional memberi tabel nama yang bisa diakses.
<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>
Pentingnya escape
Dengan Escape HTML di sel aktif (default), karakter seperti <, >, &, dan " diubah menjadi entitas, sehingga nilai seperti <b> tampil sebagai teks dan tidak mengubah tampilan halaman. Matikan opsi ini hanya jika sel memang berisi HTML tepercaya, misalnya tautan. Pratinjau berjalan di dalam frame sandbox dengan script dinonaktifkan.
Pilihan gaya
| Gaya | Hasilnya |
|---|---|
| HTML polos | Markup dasar yang mewarisi CSS situsmu |
| CSS bawaan | Blok <style> kecil: garis tepi, latar header, baris bergantian warna, dan angka rata kanan |
| Bootstrap | Kelas table table-striped table-bordered untuk situs Bootstrap 4/5 |
Untuk rich text Webflow dan situs berbasis Markdown, tabel Markdown mungkin lebih sederhana. Untuk mengubah tabel HTML yang sudah ada menjadi Markdown, gunakan HTML ke Markdown.
Juga dicari sebagai: csv ke html, excel ke tabel html, generator tabel html, konversi csv ke tabel html, json ke tabel html, spreadsheet ke html, buat tabel html online.
Tool yang cocok dipakai bersama CSV & Excel ke Tabel HTML
- Generator Select Menu — Berhenti mengetik daftar opsi secara manual.
- Formatter HTML — Tempel markup yang berantakan atau sudah di-minify, lalu dapatkan HTML rapi dengan indentasi konsisten — termasuk blok <style> dan <script> di dalamnya.
- Markdown ke HTML — Tulis atau tempel Markdown dan langsung dapatkan HTML yang rapi, dengan preview langsung yang sudah dibersihkan, tabel GitHub-flavored, daftar tugas, dan blok kode berpagar.
- Excel ke JSON — Buka workbook .xlsx atau tempel sel langsung dari Excel atau Google Sheets, lalu dapatkan JSON yang rapi.
Pertanyaan yang sering diajukan
Bagaimana cara mengubah tabel Excel menjadi HTML?
Apakah sel boleh berisi tautan atau HTML lain?
Apakah tabelnya akan responsif?
overflow-x:auto, seperti yang dilakukan kebanyakan framework responsif.