Mengonversi CSV ke Tabel HTML
Menyisipkan tabel data ke dalam artikel blog, wiki internal, atau buletin email umumnya memerlukan interaksi dengan editor tabel pada sistem manajemen konten (CMS) Anda. Gunakan format CSV sebagai pengganti: baris pertama akan ditampilkan sebagai sel <th>, setiap baris berikutnya menjadi <td>, dan seluruh tabel dibungkus dalam elemen minimal <table> tanpa gaya inline. Format penandaan yang sederhana ini kompatibel dengan semua kode CSS yang tersedia di situs Anda.
Bagaimana proses konversi berjalan
-
1
Lampirkan file CSV
Pergantian baris memisahkan setiap baris; `str_getcsv` mengurai setiap baris sehingga koma di dalam tanda kutip dan tanda kutip yang di-escape ditangani dengan benar.
-
2
Ubah mode header
Saat dalam keadaan aktif, baris pertama menampilkan sel `<th>`; saat dinonaktifkan, setiap baris menampilkan nilai `<td>` biasa.
-
3
Nilai-nilai telah dikonversi ke format HTML escaped.
Konverter memanggil fungsi pembantu e() dari Laravel, sehingga nilai `<`, `>`, dan `&` berhasil dikonversi secara aman dalam hasil keluaran.
-
4
Salin penandaan
HTML diberi indentasi dua spasi agar mudah dibaca; Anda dapat langsung memasukkannya ke dalam file Blade, postingan Markdown, atau tampilan sumber WYSIWYG.
Desain dan aksesibilitas untuk hasil keluaran
Konverter ini menghasilkan kode HTML yang secara struktural sederhana, tidak menggunakan kelas, tidak memiliki gaya inline, dan tidak menggunakan wrapper <thead> maupun <tbody>. Hal ini menjaga kelancaran penggunaan hasil outputnya, meskipun Anda mungkin ingin memberikan tampilan tambahan pada kode tersebut.
Daftar gaya minimal
table { width: 100%; border-collapse: collapse; font-size: 14px; }
th, td { padding: 8px 12px; border-bottom: 1px solid #e5e7eb; text-align: left; }
th { background: #f9fafb; font-weight: 600; }
tr:nth-child(even) td { background: #fafafa; }
Cara cepat untuk aksesibilitas
- Bungkus baris pertama dengan
<thead>jika Anda menggunakan tabel berukuran panjang; pembaca layar akan menampilkan kolom-kolom kepala saat pengguna melihat setiap baris. Konverter tidak melakukan hal ini secara otomatis untuk menjaga ukuran keluaran tetap minimal. - Tambahkan elemen
<caption>di atas tabel, dilengkapi dengan deskripsi dalam bahasa sederhana mengenai makna data tersebut. - Gunakan
scope="col"pada sel<th>jika baris header menggambarkan kolom-kolom; gunakanscope="row"jika kolom pertama mengidentifikasi baris-baris.
Ketika HTML bukan format yang tepat
Jika tujuan akhirnya adalah Markdown, gunakan Konverter CSV ke Markdown. Jika tujuannya adalah basis data, Konverter CSV ke SQL akan menghasilkan pernyataan INSERT yang dapat langsung dijalankan. Tabel HTML sangat cocok untuk ditampilkan pada halaman web, namun kurang efektif untuk operasi pencarian atau pengurutan ulang data.
Pertanyaan yang Sering Diajukan
Ya. Nilai-nilai tersebut dikonversi menggunakan helper e() dari Laravel, sehingga < menjadi <; akibatnya, konten yang disediakan pengguna tidak dapat menyisipkan tag skrip atau menutup tabel secara prematur.
Tidak secara default; hasilnya adalah satu elemen <table> yang memiliki anak <tr> secara langsung. Bungkus <tr> header ke dalam <thead>, dan sisanya ke dalam <tbody> jika CSS tujuan Anda memerlukannya.
Sel yang mengandung baris baru tertanam akan ditampilkan sebagaimana adanya. Jika Anda ingin pemisahan baris muncul di peramban, gantilah nilai tersebut dengan <br> sebelum konversi, atau atur white-space: pre-wrap; pada kode CSS <td>.
Ya. File CSV dikirim ke server kami agar konverter dapat membuat tabelnya. File tidak disimpan dan tidak ditambahkan ke tautan halaman.
Alat Terkait
Pengekstrak arsip
Periksa kontainer ZIP, JAR, XPI, DOCX, XLSX, PPTX, dan ODT secara lokal di browser, lalu unduh file satu per satu tanpa mengunggah arsip sumber.
Penggabung Lembar Excel
Gabungkan file XLSX, XLS, XLSM, XLSB, atau ODS secara lokal. Pisahkan lembar sumber atau tambahkan baris dengan header yang sama, lalu unduh XLSX.
Konverter XML ke CSV
Ubah XML berbentuk tabel datar menjadi CSV UTF-8 yang dipisahkan koma langsung di browser, lalu salin atau unduh hasilnya.
Pemecah Lembar Excel
Pisahkan buku kerja XLSX atau XLS menurut tab lembar kerja, kelompok baris data, atau nilai kolom di browser. Unduh satu XLSX atau ZIP lokal tanpa mengunggah file.
Konverter Subtitle
Konversikan subtitle SRT ke WebVTT atau VTT ke SRT secara lokal. Periksa waktu cue, pertahankan teks multibaris, lalu salin atau unduh hasilnya.
Konverter MKV ke MP4
Konversi video MKV ke MP4 agar pemutaran lebih lancar di iPhone, iPad, QuickTime, browser, TV, dan editor. Unggah berkas .mkv dan unduh .mp4 yang kompatibel.