Tabellen sind ein effektives Werkzeug, um Daten darzustellen und Informationen zu organisieren. Eine der häufigsten Abfragen bei der Arbeit mit Tabellen ist das Hinzufügen einer zusätzlichen Spalte. Dies kann nützlich sein, wenn Sie eine neue Kategorie hinzufügen oder Änderungen an einer vorhandenen Struktur vornehmen möchten. In diesem Artikel erfahren Sie, wie Sie einer Tabelle einfach und schnell eine zusätzliche Spalte hinzufügen können.
Was ist eine Tabelle
Tabellen haben eine Reihe von Vorteilen, darunter die Möglichkeit, eine geordnete Darstellung von Informationen zu erstellen, die Daten einfach zu sortieren und zu filtern sowie eine einfache Formatierung und Formatierung.
Die Hauptelemente der Tabelle sind:
- : definiert eine Tabelle
- : definiert eine Zeile in einer Tabelle
- : definiert eine Zelle in einer Tabelle
- : definiert die Titelzelle
Verwenden Sie die Elemente und, um eine Tabelle zu erstellen. Verwenden Sie das Element, um Überschriften zu erstellen.
Hier ist ein Beispiel für eine allgemeine Tabellenstruktur:
| Заголовок 1 | Заголовок 2 |
|---|---|
| Ячейка 1 | Ячейка 2 |
In diesem Beispiel enthält die Tabelle eine Überschriftenzeile und eine Datenzeile, die jeweils aus zwei Zellen besteht.
Tabellenmarkierung
Verwenden Sie ein Tag, um eine Tabelle in HTML zu erstellen. In diesem Tag können Sie andere Tags platzieren, die die Tabellenstruktur definieren.
Die wichtigsten Tags für das Tabellenlayout sind:
- - tag, das eine Tabellenzeile definiert.
- - tag, das eine Tabellenzelle definiert.
- - Tag, das die Kopfzeile einer Tabelle definiert.
Tags und werden innerhalb eines Tags verwendet, um den Inhalt der Zeilenzellen zu bestimmen. Mit einem Tag gekennzeichnete Überschriftszellen haben normalerweise ein anderes Erscheinungsbild als einfache Zellen und werden verwendet, um die Spaltenüberschriften oder Tabellenzeilen anzuzeigen.
Beispiel für einfaches Tabellenmarkierung:
Заголовок 1 Заголовок 2 Ячейка 1 Ячейка 2
In diesem Beispiel wird eine Tabelle mit zwei Spalten und zwei Zeilen erstellt. Die Spaltenüberschriften sind durch Kopfzellen gekennzeichnet, der Inhalt der Spalten und Zeilen durch einfache Zellen.
Sie können bei Bedarf weitere Spalten oder Zeilen hinzufügen, indem Sie einfach die entsprechenden Tags hinzufügen oder innerhalb des Tags einfügen .
Um beispielsweise eine zusätzliche Spalte hinzuzufügen, genügt es, jeder Zeile eine weitere Zelle hinzuzufügen:
Заголовок 1 Заголовок 2 Заголовок 3 Ячейка 1 Ячейка 2 Ячейка 3
Daher müssen Sie beim Erstellen einer Tabelle das entsprechende Markup verwenden, um die Struktur und den Inhalt der Tabelle festzulegen.
Hinzufügen einer zusätzlichen Spalte
Dazu ist es notwendig:
In der Praxis könnte dies folgendermaßen aussehen:
Содержимое колонки 1 Содержимое колонки 2 Содержимое колонки 3 Содержимое колонки 1 Содержимое колонки 2 Содержимое колонки 3 Содержимое новой колонки Содержимое колонки 2 Содержимое колонки 3
Daher wird nach Abschluss dieser Schritte eine neue Spalte mit dem angegebenen Inhalt in der Tabelle angezeigt.
Ändern des Spalteninhalts
Wenn Sie den Inhalt einer Spalte in einer Tabelle ändern müssen, können Sie verschiedene HTML-Elemente und Attribute verwenden, um das gewünschte Ergebnis zu erzielen.
Eine der einfachsten Möglichkeiten, den Inhalt einer Spalte zu ändern, ist die Verwendung eines Elements . Nachdem Sie ein Element innerhalb einer Zeichenfolge erstellt und die gewünschten Attribute festgelegt haben, können Sie beliebigen Text darin schreiben oder andere HTML-Elemente hinzufügen.
Um beispielsweise Zeilennummern zu einer Spalte hinzuzufügen, können Sie ein Attribut verwenden rowspan so kombinieren Sie mehrere Zellen in einem:
| 1 | Inhalt von Zelle 1 | Inhalt von Zelle 2 |
| Inhalt von Zelle 3 | Inhalt von Zelle 4 | |
| Inhalt von Zelle 5 | Inhalt von Zelle 6 |
Auf diese Weise wird die Zeilennummer in der ersten Spalte der Tabelle angezeigt, und in den anderen Spalten wird der Inhalt angezeigt, den Sie benötigen.
Sie können auch andere HTML-Elemente verwenden, wie zum Beispiel Links erstellen, Fett formatieren, kursiv formatieren usw. Alles hängt von Ihren Bedürfnissen ab.
Zusätzliche Lautsprecher stylen
Nachdem Sie der Tabelle eine zusätzliche Spalte hinzugefügt haben, können Sie mit dem Styling der Tabelle beginnen. Dazu können Sie CSS-Eigenschaften verwenden, mit denen Sie Ausrichtung, Breite, Hintergrundfarbe und Schriftart festlegen können.
Sie können die Eigenschaft verwenden, um den Inhalt in einer Spalte auszurichten text-align. Um den Text beispielsweise zentriert auszurichten, müssen Sie schreiben:
Verwenden Sie die Eigenschaft, um die Spaltenbreite festzulegen width. Um beispielsweise eine Spaltenbreite von 200 Pixeln festzulegen, schreiben Sie:
Sie können die Eigenschaft verwenden, um die Hintergrundfarbe einer Spalte zu ändern background-color. Um beispielsweise einen weißen Hintergrund festzulegen, müssen Sie schreiben:
Verwenden Sie die Eigenschaft, um die Farbe des Textes in einer Spalte zu ändern color. Wenn Sie beispielsweise eine schwarze Textfarbe festlegen möchten, schreiben Sie:
Sie können auch verschiedene andere Stile wie Schriftart, Textgröße, Einzug usw. hinzufügen, indem Sie die entsprechenden CSS-Eigenschaften verwenden.
Anmerkung: damit die Stile auf eine zusätzliche Spalte angewendet werden können, muss sie eine Klasse oder ID hinzufügen, die in der CSS-Regel verwendet werden soll.
Spaltenbreite bearbeiten
HTML ermöglicht das Festlegen der Breite der Tabellenspalten mithilfe eines Attributs width. Um dies zu tun, müssen Sie dieses Attribut dem Tag hinzufügen td oder th, die die entsprechende Tabellenzelle darstellt.
Wenn Sie beispielsweise eine Spaltenbreite von 200 Pixeln festlegen möchten, fügen Sie ein Attribut hinzu width mit dem Wert "200" für jede Zelle in dieser Spalte:
Заголовок 1 Заголовок 2 Строка 1, колонка 1 Строка 1, колонка 2 Строка 2, колонка 1 Строка 2, колонка 2
Die Spaltenbreite kann in Pixeln oder Prozentsätzen der Tabellenbreite angegeben werden. Wenn Sie beispielsweise die Spaltenbreite auf 20% der Tabellenbreite festlegen möchten, müssen Sie den Wert "20%" angeben.
Also mit einem Attribut width sie können die Spaltenbreite in einer Tabelle leicht bearbeiten und den gewünschten visuellen Effekt erzielen.
Entfernen einer Spalte
Um eine zusätzliche Spalte aus einer Tabelle zu entfernen, müssen Sie die HTML- und-Elemente verwenden.
1. Öffnen Sie den HTML-Code Ihrer Tabelle in einem Editor oder Texteditor.
2. Suchen Sie nach der Zeile, in der die Spaltenüberschrift definiert ist, die Sie löschen möchten. Für den Titel wird ein Tag verwendet.
3. Entfernen Sie das Tag und seinen gesamten Inhalt. Wenn sich Datenzellen in der Zeile befinden, löschen Sie die entsprechenden Tags .
4. Speichern Sie die Änderungen in der HTML-Datei, und überprüfen Sie die Tabelle im Browser, um sicherzustellen, dass die Spalte erfolgreich gelöscht wurde.
Anmerkung: Wenn Ihre Tabelle die Zellen enthält, die mit dem Colspan-Attribut horizontal verbunden sind, kann sich das Entfernen einer Spalte auf deren Anordnung und Darstellung auswirken.
Änderungen speichern
Nachdem Sie der Tabelle eine zusätzliche Spalte hinzugefügt haben, vergessen Sie nicht, die vorgenommenen Änderungen zu speichern. Dies ist wichtig, damit alle neuen Daten und Einstellungen beim nächsten Öffnen der Tabelle korrekt angezeigt werden.
Führen Sie die folgenden Schritte aus, um die Änderungen an der Tabelle zu speichern:
- Klicken Sie auf die Schaltfläche "Datei". Sie befindet sich in der oberen linken Ecke des Programmfensters.
- Wählen Sie die Option "Speichern". Dadurch wird ein Dialogfeld geöffnet, in dem Sie angeben müssen, wo die Datei gespeichert werden soll.
- Wählen Sie den Ordner aus, in dem Sie die Tabelle speichern möchten, und geben Sie einen Dateinamen ein. Vergessen Sie nicht, die Dateierweiterung anzugeben, zum Beispiel. "html" oder ".xlsx".
- Klicken Sie auf die Schaltfläche Speichern. Jetzt ist Ihre Tabelle gespeichert.
Nachdem Sie die Änderungen gespeichert haben, können Sie die Tabelle schließen oder mit der Arbeit fortfahren.
Anmerkung: Wenn Sie mit einem Online-Dienst arbeiten oder das Programm Ihre Änderungen automatisch speichert, müssen Sie diese Schritte möglicherweise nicht ausführen.
