CSV-zu-HTML-Tabellen-Konverter
Wandelt CSV-Dateien in ein HTML-Snippet mit <table><tr><td>-Auszeichnung um. Wählen Sie das Trennzeichen, ob die erste Zeile als Kopfzeile verwendet wird und ob die Zeilen in <thead>/<tbody> eingebettet werden. Das Ergebnis wird live in der Vorschau angezeigt und kann kopiert oder heruntergeladen werden. Die Umwandlung erfolgt vollständig im Browser; es werden keine Daten an einen Server gesendet.
| Trennzeichen |
|
|---|---|
| Erste Zeile als Kopfzeile verwenden | |
| In thead/tbody einbetten |
Vorschau
HTML-Code
Kopiert!Geben Sie CSV-Daten ein, um hier die erzeugte HTML-Tabelle zu sehen.
Wie eine CSV-Zeile einer HTML-Tabelle entspricht
| Eine CSV-Zeile | name,age,city |
|---|---|
| Resultierende HTML-Auszeichnung | <tr><td>name</td><td>age</td><td>city</td></tr> |
Wird die erste Zeile als Kopfzeile verwendet, wird sie zu einer Zeile aus <th>-Tags; jede weitere Zeile wird zu einer Zeile aus <td>-Tags.
Tipps
- Beim Einfügen in eine HTML-E-Mail oder ein älteres CMS ohne Markdown-Unterstützung ist die minimale Ausgabe ohne thead/tbody oft einfacher zu handhaben.
- Jedes
<,>oder&in einer Zelle wird automatisch in HTML-Entitäten umgewandelt, sodass das Einfügen des erzeugten Codes das Layout nicht zerstört. - Die Vorschau rendert die konvertierte Tabelle genauso, wie es ein Browser tun würde, sodass Sie das Aussehen prüfen können, bevor Sie den Code irgendwo kopieren.
- Kombinieren Sie dies mit den Schwesterwerkzeugen CSV zu Markdown und CSV zu JSON, um eine einzige CSV-Datei in das jeweils benötigte Format umzuwandeln.
Häufig gestellte Fragen
<table>-Auszeichnung und kann direkt in den HTML-Bearbeitungsmodus von WordPress oder in den Text einer HTML-E-Mail eingefügt werden.
Übrigens – Warum sich das <table>-Tag hartnäckig hält
In den späten 1990er-Jahren, in der Frühzeit des Webs, war das „Tabellenlayout" – der Aufbau einer gesamten Seite mit <table>-Tags – die Norm. CSS bot damals kaum Layoutmöglichkeiten, und Tabellen waren praktisch das einzige praktikable Mittel, um Inhalte in mehreren Spalten anzuordnen, sodass HTML-Quellcode jener Zeit voller <table>-Elemente war, die nichts mit tabellarischen Daten zu tun hatten.
Heute, da CSS ausgereift ist und Flexbox sowie Grid weit verbreitet sind, gilt die Verwendung von Tabellen für Layoutzwecke als bekanntes Antipattern. Für ihren eigentlichen Zweck – die Darstellung echter, in Zeilen und Spalten organisierter Daten – bleibt <table> jedoch die geeignetste und zugänglichste Wahl, da Screenreader die Beziehung zwischen <th>- und <td>-Zellen vorlesen können.
Der Bedarf, CSV-Inhalte in einen Blogbeitrag oder einen E-Mail-Newsletter einzufügen, besteht bis heute, da HTML-E-Mails kein Markdown rendern können und manchen CMS ein Markdown-Plugin fehlt. Ein Werkzeug, das Tabellenkalkulationsergebnisse per Klick in eine HTML-Tabelle umwandelt, bedient dieses schlichte, aber beständige praktische Bedürfnis.