Araca geç
ViewCSV
Dosya yüklenmez

CSV’yi HTML tablosuna dönüştürün

orders.csv· ÖRNEK VERİ15 satır · 8 sütun
Çıktı
Kenarlıklar ve sağa hizalı sayılar; yalnızca tablo çıktısında bunun yerine sınıf adları eklenir.
<table class="csv-table">
  <thead>
    <tr>
      <th scope="col">order_id</th>
      <th scope="col">customer</th>
      <th scope="col">city</th>
      <th scope="col">product</th>
      <th scope="col">quantity</th>
      <th scope="col">unit_price</th>
      <th scope="col">order_date</th>
      <th scope="col">status</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td dir="auto">001041</td>
      <td dir="auto">Yusuf Demir</td>
      <td dir="auto">Ankara</td>
      <td dir="auto">Coffee beans 1kg</td>
      <td class="num" dir="auto">2</td>
      <td class="num" dir="auto">127.75</td>
      <td dir="auto">2026-01-27</td>
      <td dir="auto">paid</td>
    </tr>
    <tr>
      <td dir="auto">001042</td>
      <td dir="auto">Asel Yıldız</td>
      <td dir="auto">Ankara</td>
      <td dir="auto">Notebook A5</td>
      <td class="num" dir="auto">5</td>
      <td class="num" dir="auto">153.28</td>
      <td dir="auto">2026-02-11</td>
      <td dir="auto">shipped</td>
    </tr>
    <tr>
      <td dir="auto">001043</td>
      <td dir="auto">Ömer Yıldırım</td>
      <td dir="auto">Adana</td>
      <td dir="auto">Desk lamp</td>
      <td class="num" dir="auto">8</td>
      <td class="num" dir="auto">216.50</td>
      <td dir="auto">2026-03-20</td>
      <td dir="auto">shipped</td>
    </tr>
    <tr>
      <td dir="auto">001044</td>
      <td dir="auto">Ecrin Doğan</td>
      <td dir="auto">Adana</td>
      <td dir="auto">Notebook A5</td>
      <td class="num" dir="auto">5</td>
      <td class="num" dir="auto">141.31</td>
      <td dir="auto">2026-04-09</td>
      <td dir="auto">pending</td>
    </tr>
    <tr>
      <td dir="auto">001045</td>
      <td dir="auto">Azra Demir</td>
      <td dir="auto">Eskişehir</td>
      <td dir="auto">Desk lamp</td>
      <td class="num" dir="auto">9</td>
      <td class="num" dir="auto"></td>
      <td dir="auto">2026-05-16</td>
      <td dir="auto">shipped</td>
    </tr>
    <tr>
      <td dir="auto">001046</td>
      <td dir="auto">Yusuf Aydın</td>
      <td dir="auto">İzmir</td>
      <td dir="auto">Coffee beans 1kg</td>
      <td class="num" dir="auto">2</td>
      <td class="num" dir="auto">87.81</td>
      <td dir="auto">2026-06-23</td>
      <td dir="auto">shipped</td>
    </tr>
    <tr>
      <td dir="auto">001047</td>
      <td dir="auto"> Ömer Aydın </td>
      <td dir="auto">İzmir</td>
      <td dir="auto">Chair, ergonomic</td>
      <td class="num" dir="auto">8</td>
      <td class="num" dir="auto">80.58</td>
      <td dir="auto">2026-07-17</td>
      <td dir="auto">shipped</td>
    </tr>
    <tr>
      <td dir="auto">001048</td>
      <td dir="auto">Mustafa Arslan</td>
      <td dir="auto">Eskişehir</td>
      <td dir="auto">Chair, ergonomic</td>
      <td class="num" dir="auto">4</td>
      <td class="num" dir="auto">127.60</td>
      <td dir="auto">2026-08-21</td>
      <td dir="auto">shipped</td>
    </tr>
    <tr>
      <td dir="auto">001049</td>
      <td dir="auto">Kerem Demir</td>
      <td dir="auto">İzmir</td>
      <td dir="auto">Monitor 27&quot;</td>
      <td class="num" dir="auto">7</td>
      <td class="num" dir="auto">223.28</td>
      <td dir="auto">2026-09-08</td>
      <td dir="auto">paid</td>
    </tr>
    <tr>
      <td dir="auto">001050</td>
      <td dir="auto">Asel Doğan</td>
      <td dir="auto">Ankara</td>
      <td dir="auto">Desk lamp</td>
      <td class="num" dir="auto">5</td>
      <td class="num" dir="auto">244.39</td>
      <td dir="auto">2026-01-21</td>
      <td dir="auto">shipped</td>
    </tr>
    <tr>
      <td dir="auto">001051</td>
      <td dir="auto">Asel Özdemir</td>
      <td dir="auto">Antalya</td>
      <td dir="auto">Desk lamp</td>
      <td class="num" dir="auto">7</td>
      <td class="num" dir="auto">213.46</td>
      <td dir="auto">2026-02-08</td>
      <td dir="auto">refunded</td>
    </tr>
    <tr>
      <td dir="auto">001052</td>
      <td dir="auto">Ömer Kaya</td>
      <td dir="auto">Antalya</td>
      <td dir="auto">Coffee beans 1kg</td>
      <td class="num" dir="auto">9</td>
      <td class="num" dir="auto">118.00</td>
      <td dir="auto">2026-03-16</td>
      <td dir="auto">refunded</td>
    </tr>
    <tr>
      <td dir="auto">001053</td>
      <td dir="auto">Ömer Aydın</td>
      <td dir="auto">Bursa</td>
      <td dir="auto">Coffee beans 1kg</td>
      <td class="num" dir="auto">2</td>
      <td class="num" dir="auto">121.81</td>
      <td dir="auto">2026-04-13</td>
      <td dir="auto">refunded</td>
    </tr>
    <tr>
      <td dir="auto">001054</td>
      <td dir="auto">Zeynep Yıldırım</td>
      <td dir="auto">Adana</td>
      <td dir="auto">USB-C cable</td>
      <td class="num" dir="auto">7</td>
      <td class="num" dir="auto">184.52</td>
      <td dir="auto">2026-05-26</td>
      <td dir="auto">paid</td>
    </tr>
    <tr>
      <td dir="auto">001043</td>
      <td dir="auto">Ömer Yıldırım</td>
      <td dir="auto">Adana</td>
      <td dir="auto">Desk lamp</td>
      <td class="num" dir="auto">8</td>
      <td class="num" dir="auto">216.50</td>
      <td dir="auto">2026-03-20</td>
      <td dir="auto">shipped</td>
    </tr>
  </tbody>
</table>

15 satır · 1 dosya

Bir CSV dosyası açın veya yapıştırın; <th scope="col"> başlıklarından oluşan bir <thead> ve her satır için bir <tr> içeren bir <table> ya da doğrudan açabileceğiniz tam bir HTML sayfası elde edin. Her değer HTML kaçışlıdır; böylece verinizdeki <script> veya & metin olarak görünür, hiçbir zaman işaretlemeye dönüşmez. Dosya tarayıcınızda dönüştürülür, hiçbir zaman yüklenmez.

CSV, HTML’e nasıl dönüştürülür?

  1. Dosya aç düğmesini seçin, araca bir .csv, .tsv veya .txt dosyası sürükleyin ya da Yapıştır seçeneğini kullanın. Sütunlar yanlış görünüyorsa ayırıcıyı veya kodlamayı İçeri aktarma ayarları altından düzeltin.
  2. Çıktı altında, kodu mevcut bir sayfaya veya içerik yönetim sistemine (CMS) yapıştırmak için Yalnızca tablo, bağımsız bir dosya için Tam HTML sayfası seçeneğini seçin.
  3. Bir Başlık (isteğe bağlı) ekleyin, stil ve satır sonu ayarlarına karar verin, ardından Kopyala veya HTML indir seçeneğini kullanın.

Bir README veya wiki için Markdown tablosu genellikle daha kolay düzenlenir; yazdırılabilir bir dosya için CSV’den PDF’e aracını kullanın.

HTML tablosu seçenekleri

Yalnızca tabloVarsayılan. Yalnızca <table> öğesi; bir sayfaya, e-posta şablonuna veya CMS’in HTML bloğuna yapıştırılmaya hazırdır.
Tam HTML sayfası<!doctype html>, <html lang="en"> (Türkçe sitede lang="tr"), <meta charset="utf-8"> ve bir <title> (başlık ya da başlık yoksa Table) ekler; böylece dosya her tarayıcıda doğru açılır.
Başlık (isteğe bağlı)Tablonun ilk alt öğesi olarak bir <caption> yazar: ekran okuyucuların tablo için seslendirdiği erişilebilir ad.
Basit stil ekleVarsayılan olarak açıktır. Tam sayfada küçük bir stil sayfası yerleştirir: kenarlıklar, gölgeli bir başlık satırı ve sağa hizalı sayılar. Yalnızca tablo seçiliyken bunun yerine tabloya class="csv-table", sayı hücrelerine class="num" ekler; böylece görünümü kendi CSS’iniz belirler.
Hücre içindeki satır sonlarını gösterVarsayılan olarak açıktır. Bir değerin içindeki satır sonu <br> olur. Kapalıyken satır sonu kaynakta kalır; tarayıcılar onu boşluk olarak gösterir.

Kaçış karakterleri, yazı yönü ve sayılar

  • Her hücrede, başlıkta ve tablo başlığında &, <, >, " ve ' karakterleri &amp;, &lt;, &gt;, &quot; ve &#39; olarak yazılır. Verinizdeki etiketler metin olarak görünür; bu, CSV’deki mevcut HTML’in de oluşturulmayacağı anlamına gelir.
  • Her hücrede dir="auto" bulunur; böylece Arapça veya İbranice değerler soldan sağa bir sayfanın içinde bile sağdan sola görüntülenir.
  • Bir sütun ancak boş olmayan her değeri sade bir sayıysa sayısal sayılır; 0042 gibi bir kimlik sütunu metin olarak bırakılır ve sağa hizalanmaz. Değerlerin kendisi hiçbir zaman yeniden biçimlendirilmez.
  • Tırnak içindeki virgüller, tırnaklar ve satır sonları RFC 4180 kurallarına göre okunur. Boş bir başlık Column 3, yinelenen bir başlık name (2) olur.
  • Çıktı UTF-8’dir. Tam sayfa bunu <meta charset="utf-8"> ile bildirir; Yalnızca tablo çıktısını başka bir sayfaya yapıştırdığınızda o sayfanın da UTF-8 olması gerekir.

HTML tablosu yanlış göründüğünde

  • Kaynak dosyada Türkçe harfler ü, ç gibi görünüyor. CSV UTF-8 değil. İçeri aktarma ayarları altında dosyanın kodlamasını seçin (eski Türkçe Excel dışa aktarımlarında genellikle Windows-1254) ve dosyayı yeniden açın.
  • Verilerimdeki etiketler metin olarak görünüyor. Hücrelerinizdeki HTML, işaretleme olarak çalışamasın diye bilerek kaçışlandı. İçeriğe güveniyor ve oluşturulmasını istiyorsanız sonucu düzenleyin.
  • Yapıştırılan tablonun kenarlığı yok. Yalnızca tablo (stil açıkken) CSS değil, sınıf adları ekler. Sitenizin stil sayfasında .csv-table ve td.num için stil tanımlayın ya da yerleşik stilleri almak için Tam HTML sayfası seçeneğini seçin.
  • Tüm değerler tek sütunda. Ayırıcı yanlış tahmin edilmiş; ayırıcıyı İçeri aktarma ayarları altından belirleyin.

Sınırlar ve gizlilik

25 MB, 100.000 satır veya 2 milyon hücreye kadar dosyalar, ilk 200 satırın canlı önizlemesiyle açılır. Daha büyük dosyalar akış modunda dönüştürülür: dosya parçalar hâlinde iki kez okunur (bir kez sütunları ve hangilerinin sayısal olduğunu ölçmek, bir kez de yazmak için), bir bildirim indirilen dosyanın tüm dosyayı kapsadığını söyler ve Kopyala sunulmaz. Tek bir çıktı dosyası en fazla 4 GB olabilir.

Dönüştürme bu sekmede arka plandaki bir işçide çalışır; böylece sayfa yanıt vermeye devam eder ve İptal işlemi durdurur. CSV hiçbir zaman bir sunucuya gönderilmez.

Örnek: HTML’de özel anlamı olan karakterler içeren bir sipariş listesi

İki satırlık bir yorumun içinde ve işareti (&), kesme işareti, tırnaklar ve HTML içeren bir sipariş listesi, varsayılan ayarlarla (Yalnızca tablo, stilli, satır sonları gösterilir) dönüştürüldü. qty sütununun tamamı sayı olduğu için hücreleri class="num" alır.

CSV
id,product,qty,comment
0042,Fish & Chips,2,"<b>Extra</b> vinegar
no salt"
0043,"O'Brien's ""Stout""",12,
HTML
<table class="csv-table">
  <thead>
    <tr>
      <th scope="col">id</th>
      <th scope="col">product</th>
      <th scope="col">qty</th>
      <th scope="col">comment</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td dir="auto">0042</td>
      <td dir="auto">Fish &amp; Chips</td>
      <td class="num" dir="auto">2</td>
      <td dir="auto">&lt;b&gt;Extra&lt;/b&gt; vinegar<br>no salt</td>
    </tr>
    <tr>
      <td dir="auto">0043</td>
      <td dir="auto">O&#39;Brien&#39;s &quot;Stout&quot;</td>
      <td class="num" dir="auto">12</td>
      <td dir="auto"></td>
    </tr>
  </tbody>
</table>

Sık sorulan sorular

Çıktıyı web siteme yapıştırmak güvenli mi?

Veri işaretleme enjekte edemez: her değer, başlık ve tablo başlığı HTML kaçışlıdır ve hiçbir değer bir özniteliğe yerleştirilmez. Çıktıdaki etiketler yalnızca dönüştürücünün kendisinin yazdığı tablo öğeleridir.

Sayfada neden lang="tr" (veya lang="en") yazıyor?

Tam sayfa, dil etiketini kullandığınız sitenin dilinden alır. Verileriniz başka bir dildeyse indirdikten sonra lang özniteliğini değiştirin.

HTML tablosunu sıralayabilir veya filtreleyebilir miyim?

Çıktı, betik içermeyen statik bir tablodur. Veriyi önce CSV satırlarını sırala veya CSV satırlarını filtrele ile sıralayın ya da filtreleyin, ardından dönüştürün.

Standartlar ve kaynaklar