Inhalte in Tabellen darstellen

Zuletzt aktualisiert am 27. April 2021

Hier erfahren Sie, wie Sie Inhalte auf Ihrer Website mithilfe von Tabellen präsentieren. Informieren Sie sich auch, wie Sie Tabellenzellen teilen und zusammenführen und wie Sie Tabellendaten importieren und exportieren.

Tabellen sind ein mächtiges Tool für die Darstellung von tabellarischen Daten auf einer HTML-Seite. Eine Tabelle besteht aus einer oder mehreren Zeilen, eine Zeile aus einer oder mehreren Zellen. Obwohl Spalten normalerweise nicht explizit im HTML-Code angegeben werden, ermöglicht es dir Dreamweaver, sowohl Spalten als auch Zeilen und Zellen zu manipulieren.

Anmerkung

Es wird empfohlen, keine Tabellen für das Layout deiner Web-Seite zu verwenden. Probiere die Starter-Vorlagen (Datei > Neu > Starter-Vorlagen) aus, um mit vorgestalteten Layouts zu beginnen. Du kannst deinen eigenen Text und deine Bilder in diese Layouts einfügen und sie mit CSS gestalten.

Formatierungsreihenfolge von Tabellen in HTML

Wenn Sie Tabellen in der Entwurfsansicht formatieren, können Sie Eigenschaften für die gesamte Tabelle oder für ausgewählte Zeilen, Spalten oder Zellen der Tabelle festlegen. Bei einzelnen Tabellenzellen kann für eine Eigenschaft, beispielsweise Hintergrundfarbe oder Ausrichtung, ein anderer Wert als für die gesamte Tabelle festgelegt werden. Dabei hat die Formatierung der Zellen Vorrang vor der Formatierung der Zeilen, die wiederum Vorrang vor der Formatierung der Tabelle hat.

Die Rangfolge bei der Formatierung von Tabellen lautet wie folgt:

  1. Zellen
  2. Zeilen
  3. Tabelle

Wenn du beispielsweise die Hintergrundfarbe für eine einzelne Zelle auf Blau einstellst und dann die Hintergrundfarbe der gesamten Tabelle auf Gelb setzt, ändert sich die blaue Zelle nicht zu Gelb, da die Zellenformatierung Vorrang vor der Tabellenformatierung hat.

Anmerkung

Wenn du Eigenschaften für eine Spalte festlegst, ändert Dreamweaver die Attribute des td-Tags, der jeder Zelle in der Spalte entspricht.

Tabellenzellen teilen und zusammenführen

Du kannst beliebig viele benachbarte Zellen zusammenführen – solange die gesamte Auswahl eine Linie oder ein Rechteck aus Zellen ist –, um eine einzelne Zelle zu erstellen, die sich über mehrere Spalten oder Zeilen erstreckt. Du kannst eine Zelle in beliebig viele Zeilen oder Spalten aufteilen, unabhängig davon, ob sie zuvor zusammengeführt wurde. Dreamweaver strukturiert die Tabelle automatisch um (indem alle notwendigen colspan- oder rowspan-Attribute hinzugefügt werden), um die angegebene Anordnung zu erstellen.

Im folgenden Beispiel wurden die Zellen in der Mitte der ersten beiden Zeilen zu einer einzigen Zelle zusammengeführt, die sich über zwei Zeilen erstreckt.

Verbundene Zellen

Tabellen und Inhalte einfügen

Verwende das Einfügen-Bedienfeld oder das Einfügen-Menü, um eine neue Tabelle zu erstellen. Füge dann Text und Bilder zu Tabellenzellen auf dieselbe Weise hinzu, wie du Text und Bilder außerhalb einer Tabelle hinzufügst.

Platziere die Einfügemarke dort, wo die Tabelle erscheinen soll.

Anmerkung

Wenn dein Dokument leer ist, kannst du die Einfügemarke nur am Anfang des Dokuments platzieren.

  • Wählen Sie „Einfügen“ > „Tabelle“ aus.

  • Klicke in der HTML-Kategorie des Einfügen-Bedienfelds auf Tabelle.

Lege die Attribute des Tabelle-Dialogfelds fest und klicke auf OK, um die Tabelle zu erstellen.
Erstellen einer Tabelle
Erstellen einer Tabelle

Zeilen

Legt die Anzahl der Tabellenzeilen fest.

Spalten

Legt die Anzahl der Tabellenspalten fest.

Tabellenbreite

Gibt die Breite der Tabelle in Pixeln oder als Prozentsatz der Browser-Fenster-Breite an.

Randstärke

gibt die Breite der Tabellenränder in Pixel an.

Zellabstand

legt den Abstand zwischen aneinandergrenzenden Tabellenzellen in Pixel fest.

Anmerkung

Wenn Sie für Randstärke, Zellabstand und Zellauffüllung nicht ausdrücklich Werte zuweisen, wird in den meisten Browsern für die Randstärke und die Zellauffüllung der Wert „1“ und für den Zellabstand der Wert „2“ festgelegt. Legen Sie für „Zellauffüllung“ und „Zellabstand“ den Wert „0“ fest, wenn die Tabelle im Browser ohne Rand, Zellauffüllung und Zellabstand angezeigt werden soll.

Zellauffüllung

Bestimmt die Anzahl der Pixel zwischen dem Rahmen einer Zelle und ihrem Inhalt.

Keine

Die Spalten- oder Zeilenüberschriften in der Tabelle sind nicht aktiviert.

Links

Macht die erste Spalte der Tabelle zu einer Spalte für Überschriften, sodass du eine Überschrift für jede Zeile der Tabelle eingeben kannst.

Oben

Macht die erste Zeile der Tabelle zu einer Zeile für Überschriften, sodass du eine Überschrift für jede Spalte der Tabelle eingeben kannst.

Beide

In der Tabelle können Spalten- und Zeilenüberschriften eingegeben werden.

Anmerkung

Falls Sie davon ausgehen können, dass von den Besuchern Ihrer Website Bildschirmlesegeräte verwendet werden, empfiehlt es sich, Überschriften einzugeben. Mit Bildschirmlesegeräten werden die Tabellenüberschriften gelesen, sodass Benutzer sich leichter in der Tabelle zurechtfinden.

Beschriftung

Stellt einen Tabellentitel zur Verfügung, der außerhalb der Tabelle angezeigt wird.

Zusammenfassung

Enthält eine Beschreibung der Tabelle. Screenreader lesen den Zusammenfassungstext vor, aber der Text wird nicht im Browser des Benutzers angezeigt.

Tabellen importieren und exportieren

Du kannst tabellarische Daten, die in einer anderen Anwendung erstellt wurden (wie Microsoft Excel) und in einem durch Trennzeichen getrennten Textformat gespeichert wurden (mit durch Tabs, Kommas, Doppelpunkte oder Semikolons getrennten Elementen), in Dreamweaver importieren und als Tabelle formatieren.

Du kannst auch Tabellendaten aus Dreamweaver in eine Textdatei exportieren, wobei die Inhalte benachbarter Zellen durch ein Trennzeichen getrennt werden.Du kannst Kommas, Doppelpunkte, Semikolons oder Leerzeichen als Trennzeichen verwenden.Wenn du eine Tabelle exportierst, wird die gesamte Tabelle exportiert; du kannst keine Teile einer Tabelle zum Exportieren auswählen.

Anmerkung

Wenn du nur einige Daten aus einer Tabelle möchtest—zum Beispiel die ersten sechs Zeilen oder die ersten sechs Spalten—dann kopiere die Zellen mit diesen Daten, füge sie außerhalb der Tabelle ein (um eine neue Tabelle zu erstellen) und exportiere die neue Tabelle.

Tabellendaten importieren

Wähle Datei > Import > Tabellarische Daten importieren.

Geben Sie die Optionen für die Tabellendaten an und klicken Sie auf „OK“.

Datendatei

Der Name der zu importierenden Datei. Klicke auf den Button Durchsuchen, um eine Datei auszuwählen.

Delimiter

Das in der importierten Datei verwendete Trennzeichen.

Wenn Sie „Anderes“ auswählen, wird rechts neben dem Popupmenü ein Textfeld angezeigt. Geben Sie das in der Datei verwendete Trennzeichen ein.

Anmerkung

Geben Sie das Trennzeichen an, das beim Speichern der Datendatei verwendet wurde. Andernfalls wird die Datei nicht ordnungsgemäß importiert und die Daten werden in der Tabelle nicht korrekt formatiert.

Tabellenbreite

Die Breite der Tabelle.

  • Wählen Sie „An Daten anpassen“ aus, damit die Spaltenbreite an die längste Textzeichenfolge in der Spalte angepasst wird.

  • Wählen Sie „Festlegen“ aus, um eine feste Tabellenbreite in Pixel oder als Prozentsatz der Fensterbreite des Browsers festzulegen.

Rahmen

gibt die Breite der Tabellenränder in Pixel an.

Zellauffüllung

Die Anzahl der Pixel zwischen dem Inhalt einer Zelle und den Zellgrenzen.

Zellabstand

Der Abstand zwischen aneinander grenzenden Tabellenzellen in Pixel.

Anmerkung

Wenn Sie für Rahmen, Zellabstand und Zellauffüllung nicht ausdrücklich Werte zuweisen, wird in den meisten Browsern für den Rahmen und die Zellauffüllung der Wert „1“ und für den Zellabstand der Wert „2“ festgelegt. Legen Sie für „Zellauffüllung“ und „Zellabstand“ den Wert „0“ fest, wenn die Tabelle im Browser ohne Zellauffüllung und Zellabstand angezeigt werden soll. Wenn für „Rahmen“ der Wert „0“ festgelegt ist und die Zell- und Tabellenränder angezeigt werden sollen, wählen Sie „Ansicht“ > „Visuelle Hilfsmittel“ > „Tabellenrahmen“ aus.

Format der obersten Zeile

Bestimmt, welche Formatierung, falls vorhanden, auf die oberste Zeile der Tabelle angewendet wird.Wähle aus vier Formatierungsoptionen: keine Formatierung, Fett, Kursiv oder fett kursiv.

Tabellen exportieren

Platziere den Einfügepunkt in eine beliebige Zelle der Tabelle.
Wähle Datei > Export > Tabelle.
Legen Sie die folgenden Optionen fest:

Trennzeichen

Gibt an, welches Trennzeichen verwendet werden soll, um Elemente in der exportierten Datei zu trennen.

Zeilenumbrüche

Gibt an, in welchem Betriebssystem du die exportierte Datei öffnen wirst: Windows, Macintosh oder UNIX.(Verschiedene Betriebssysteme haben unterschiedliche Methoden, das Ende einer Textzeile anzuzeigen.)

Klicken Sie auf „Exportieren“.
Geben Sie einen Namen für die Datei ein und klicken Sie auf „Speichern“.

Tabellenelemente auswählen

Du kannst eine ganze Tabelle, Zeile oder Spalte auf einmal auswählen.Du kannst auch eine oder mehrere einzelne Zellen auswählen.

Wenn du deinen Zeiger über eine Tabelle, Zeile, Spalte oder Zelle bewegst, hebt Dreamweaver alle Zellen in dieser Auswahl hervor, damit du weißt, welche Zellen ausgewählt werden.Das ist nützlich, wenn du Tabellen ohne Rahmen, Zellen, die mehrere Spalten oder Zeilen überspannen, oder verschachtelte Tabellen hast.Du kannst die Hervorhebungsfarbe in den Einstellungen ändern.

Anmerkung

Wenn du den Zeiger über den Rahmen einer Tabelle positionierst und dann die Strg-Taste (Windows) oder Befehlstaste (Macintosh) gedrückt hältst, wird die gesamte Struktur der Tabelle—das heißt, alle Zellen in der Tabelle—hervorgehoben.Das ist nützlich, wenn du verschachtelte Tabellen hast und die Struktur einer der Tabellen sehen möchtest.

Ganze Tabelle auswählen

Führe einen der folgenden Schritte aus, um eine Tabelle auszuwählen:

  • Klicke auf die obere linke Ecke der Tabelle, um die Tabelle auszuwählen.
  • Klicke in eine Tabellenzelle und wähle dann das Tag in der Tag-Auswahl in der unteren linken Ecke des Dokumentfensters aus.
  • Klicken Sie in eine Tabellenzelle und dann auf das Kopfzeilenmenü und wählen Sie „Tabelle auswählen“. Am unteren und rechten Rand der ausgewählten Tabelle werden Auswahlziehpunkte angezeigt.
  • Klicke in eine Tabellenzelle und wähle Bearbeiten > Tabelle > Tabelle auswählen.

Wähle einzelne oder mehrere Zeilen oder Spalten aus

Positioniere den Zeiger am linken Rand einer Zeile oder am oberen Rand einer Spalte.
Wenn sich der Zeiger zu einem Auswahlpfeil ändert, klicke um eine Zeile oder Spalte auszuwählen, oder ziehe, um mehrere Zeilen oder Spalten auszuwählen.
Einzelne Zeilen auswählen

Einzelne Spalten auswählen

Klicken Sie in die entsprechende Spalte.
Klicke auf das Spalten-Header-Menü und wähle Spalte auswählen.

Einzelne Zellen auswählen

Führen Sie einen der folgenden Schritte aus:

  • Klicken Sie in die Zelle und wählen Sie dann im Tag-Selektor unten links im Dokumentfenster das Tag <td> aus.
  • Klicken Sie bei gedrückter Strg-Taste (Windows) bzw. Befehlstaste (Macintosh) in die Zelle.

Wähle eine Linie oder einen rechteckigen Zellblock aus

Führen Sie einen der folgenden Schritte aus:
  • Ziehen Sie den Mauszeiger von einer Zelle in eine andere Zelle.

  • Klicken Sie in eine Zelle, klicken Sie bei gedrückter Strg-Taste (Windows) bzw. Befehlstaste (Macintosh) in die gleiche Zelle, um diese auszuwählen, und klicken Sie dann bei gedrückter Umschalttaste in eine andere Zelle.

Einen Zellenblock auswählen

Nicht aneinandergrenzende Zellen auswählen

Strg-klicke (Windows) oder Cmd-klicke (Macintosh) auf die Zellen, Zeilen oder Spalten, die du auswählen möchtest.

Wenn jede Zelle, Zeile oder Spalte, auf die du bei gedrückter Strg-Taste oder Befehlstaste klickst, noch nicht ausgewählt ist, wird sie zur Auswahl hinzugefügt.Wenn sie bereits ausgewählt ist, wird sie aus der Auswahl entfernt.

Ändere die Hervorhebungsfarbe für Tabellenelemente

Wähle Bearbeiten > Voreinstellungen (Windows) oder Dreamweaver > Voreinstellungen (Macintosh).
Wähle Hervorhebung aus der Kategorienliste links, nimm eine der folgenden Änderungen vor und klicke auf OK.
  • Um die Markierungsfarbe für Tabellenelemente zu ändern, klicken Sie auf das Farbfeld „Mouse-Over“ und wählen Sie mit dem Farbwähler eine Markierungsfarbe aus (oder geben Sie den Hexadezimalwert für die Markierungsfarbe im Textfeld ein).

  • Um die Markierung von Tabellenelementen zu aktivieren oder zu deaktivieren, aktivieren oder deaktivieren Sie das Kontrollkästchen „Anzeigen“ für „Mouse-Over“.

Anmerkung

Diese Optionen betreffen alle Objekte, die Dreamweaver hervorhebt, wenn du den Zeiger darüber bewegst.  

Tabelleneigenschaften festlegen

Du kannst den Eigenschafteninspektor verwenden, um Tabellen zu bearbeiten.

Wählen Sie eine Tabelle aus.
Ändere im Eigenschafteninspektor (Fenster > Eigenschaften) Eigenschaften nach Bedarf.
Tabelleneigenschaften
Tabelleneigenschaften

Tabellen-ID

Die Identifikationsnummer der Tabelle.

Zeilen und Spalten

Die Anzahl der Zeilen und Spalten in der Tabelle.

W

Die Breite der Tabelle in Pixel oder als Prozentsatz der Fensterbreite des Browsers.

Anmerkung

Die Höhe einer Tabelle müssen Sie in der Regel nicht festlegen.

Zellauffüllung

Die Anzahl der Pixel zwischen dem Inhalt einer Zelle und den Zellgrenzen.

Zellabstand

Der Abstand zwischen aneinander grenzenden Tabellenzellen in Pixel.

Ausrichten

Gibt an, an welcher Stelle die Tabelle relativ zu anderen Elementen im gleichen Absatz, beispielsweise Text oder Bilder, angezeigt wird.

Über „Links“ wird die Tabelle links neben anderen Elementen ausgerichtet (Text im gleichen Absatz wird rechts neben der Tabelle umgebrochen). Über „Rechts“ wird die Tabelle rechts neben anderen Elementen ausgerichtet (Text wird links neben der Tabelle umgebrochen). Über „Zentriert“ wird die Tabelle zentriert (Text wird oberhalb und/oder unterhalb der Tabelle angezeigt). „Standard“ gibt an, dass die Standardausrichtung des Browsers verwendet wird.

Anmerkung

Wenn die Ausrichtungsoption „Standard“ ausgewählt ist, wird neben der Tabelle kein anderer Inhalt angezeigt. Wenn eine Tabelle neben anderen Inhalten angezeigt werden soll, wählen Sie die Ausrichtungsoption „Links“ oder „Rechts“ aus.

Rahmen

gibt die Breite der Tabellenränder in Pixel an.

Anmerkung

Wenn Sie für Rahmen, Zellabstand und Zellauffüllung nicht ausdrücklich Werte zuweisen, wird in den meisten Browsern für den Rahmen und die Zellauffüllung der Wert „1“ und für den Zellabstand der Wert „2“ festgelegt. Legen Sie für „Rahmen“, „Zellauffüllung“ und „Zellabstand“ den Wert „0“ fest, wenn die Tabelle im Browser ohne Zellauffüllung und Zellabstand angezeigt werden soll. Wenn für „Rahmen“ der Wert „0“ festgelegt ist und die Zell- und Tabellenränder angezeigt werden sollen, wählen Sie „Ansicht“ > „Visuelle Hilfsmittel“ > „Tabellenrahmen“ aus.

Klasse

Legt eine CSS-Klasse in der Tabelle fest.

Anmerkung

Unter Umständen müssen Sie den Eigenschafteninspektor für Tabellen erweitern, damit die folgenden Optionen angezeigt werden. Klicken Sie zum Erweitern des Eigenschafteninspektors für Tabellen auf den Erweiterungspfeil in der rechten unteren Ecke.

Spaltenbreiten löschen und Zeilenhöhen löschen

und „Zeilenhöhen löschen“ löschen in der Tabelle alle explizit festgelegten Werte für Spaltenbreite oder Zeilenhöhe.

Tabellenbreite in Pixel konvertieren

und Tabellenhöhen in Pixel konvertieren setzt die Breite oder Höhe jeder Spalte in der Tabelle auf ihre aktuelle Breite in Pixeln (setzt auch die Breite der gesamten Tabelle auf ihre aktuelle Breite in Pixeln).

Tabellenbreite in Prozent konvertieren

und Tabellenhöhen in Prozent konvertieren legt die Breite oder Höhe jeder Spalte in der Tabelle auf ihre aktuelle Breite fest, ausgedrückt als Prozentsatz der Breite des Dokumentfensters (legt auch die Breite der gesamten Tabelle auf ihre aktuelle Breite als Prozentsatz der Breite des Dokumentfensters fest).

Wenn du einen Wert in ein Textfeld eingegeben hast, drücke Tab oder Enter (Windows) oder Return (Macintosh), um den Wert anzuwenden.

Eigenschaften für Zellen, Zeilen und Spalten festlegen

Du kannst den Eigenschafteninspektor verwenden, um Zellen und Zeilen in einer Tabelle zu bearbeiten.

Wählen Sie die gewünschte Spalte oder Zeile aus.
Legen Sie im Eigenschafteninspektor („Fenster“ > „Eigenschaften“) die folgenden Optionen fest:

Horiz

Gibt die horizontale Ausrichtung des Inhalts einer Zelle, Zeile oder Spalte an. Du kannst den Inhalt links, rechts oder zentriert in den Zellen ausrichten oder angeben, dass der Browser seine Standardausrichtung verwenden soll (normalerweise links für normale Zellen und zentriert für Header-Zellen).

Vert

Gibt die vertikale Ausrichtung des Inhalts einer Zelle, Zeile oder Spalte an. Du kannst den Inhalt oben, mittig, unten oder an der Baseline der Zellen ausrichten oder angeben, dass der Browser seine Standardausrichtung verwenden soll (normalerweise mittig).

B/H

Geben die Breite und Höhe der ausgewählten Zellen in Pixel oder als Prozentsatz der gesamten Tabellenbreite oder -höhe an. Wenn Sie Breite und Höhe als Prozentwert angeben möchten, tragen Sie hinter dem Wert ein Prozentzeichen (%) ein. Lassen Sie das Feld leer (Standardeinstellung), wenn die Spaltenbreite oder -höhe entsprechend dem Zellinhalt sowie der Breite und Höhe der anderen Spalten und Zeilen im Browser festgelegt werden soll.

In der Standardeinstellung wird im Browser die Zeilenhöhe und Spaltenbreite anhand des breitesten Bilds oder der längsten Zeile einer Spalte ausgewählt. Daher wird eine Spalte beim Hinzufügen von Inhalt manchmal wesentlich breiter als andere Spalten in der Tabelle.

Anmerkung

Sie können die Höhe als Prozentsatz der gesamten Tabellenhöhe angeben, die Zeile wird dann jedoch in Browsern möglicherweise nicht mit dem festgelegten Prozentsatz angezeigt.

Hg

Die Hintergrundfarbe für eine Zelle, Spalte oder Zeile, die mit dem Farbwähler ausgewählt wurde.

Zellen verbinden

Fasst Zellen, Zeilen oder Spalten zu einer Zelle zusammen. Zellen können nur verbunden werden, wenn sie eine Reihe oder ein Rechteck bilden.

Zelle teilen

Teilt eine Zelle in mindestens zwei Zellen. Du kannst immer nur eine Zelle teilen. Dieser Button ist deaktiviert, wenn mehr als eine Zelle ausgewählt ist.

Kein Umbruch

Verhindert Zeilenwechsel und hält den gesamten Text in einer bestimmten Zelle in einer einzigen Zeile.Wenn Kein Umbruch aktiviert ist, werden Zellen erweitert, um alle Daten beim Tippen oder Einfügen in eine Zelle aufzunehmen.(Normalerweise werden Zellen horizontal erweitert, um das längste Wort oder das breiteste Bild in der Zelle aufzunehmen, und dann vertikal erweitert, um andere Inhalte aufzunehmen.)

header

Formatiert die ausgewählten Zellen als Tabellenkopfzellen.Der Inhalt von Tabellenkopfzellen ist standardmäßig fett und zentriert.

Anmerkung

Du kannst Breiten und Höhen als Pixel oder Prozentangaben angeben und von Pixeln zu Prozentangaben konvertieren und umgekehrt.

Anmerkung

Wenn du Eigenschaften für eine Spalte festlegst, ändert Dreamweaver die Attribute des td-Tags, das jeder Zelle in der Spalte entspricht.Wenn du jedoch bestimmte Eigenschaften für eine Zeile festlegst, ändert Dreamweaver die Attribute des tr -Tags, anstatt die Attribute jedes td -Tags in der Zeile zu ändern.Wenn du dasselbe Format auf alle Zellen in einer Zeile anwendest, erzeugt die Anwendung des Formats auf das tr -Tag saubereren und präziseren HTML-Code.

Drücke Tab oder Enter (Windows) oder Return (Macintosh), um den Wert anzuwenden.

Tabellen und Zellen formatieren

Du kannst das Erscheinungsbild von Tabellen ändern, indem du Eigenschaften für die Tabelle und ihre Zellen festlegst oder ein vorgefertigtes Design auf die Tabelle anwendest.Bevor du Tabellen- und Zelleneigenschaften festlegst, beachte, dass die Rangfolge für die Formatierung Zellen, Zeilen und Tabellen ist.

Anmerkung

Um Text in einer Tabellenzelle zu formatieren, verwende dieselben Verfahren, die du auch verwenden würdest, um Text außerhalb einer Tabelle zu formatieren.

Format einer Tabelle, Zeile, Zelle oder Spalte ändern

Wählen Sie eine Tabelle, Zelle, Zeile oder Spalte aus.
Klicke im Eigenschafteninspektor (Fenster > Eigenschaften) auf den Erweiterungspfeil in der unteren rechten Ecke und ändere die Eigenschaften nach Bedarf.
Ändern Sie die Eigenschaften nach Bedarf.

Weitere Informationen zu den Optionen erhältst du, wenn du auf das Hilfesymbol im Eigenschafteninspektor klickst.

Anmerkung

Wenn du Eigenschaften für eine Spalte festlegst, ändert Dreamweaver die Attribute des td-Tags, das jeder Zelle in der Spalte entspricht.Wenn du jedoch bestimmte Eigenschaften für eine Zeile festlegst, ändert Dreamweaver die Attribute des tr-Tags, anstatt die Attribute jedes td -Tags in der Zeile zu ändern. Wenn du dasselbe Format auf alle Zellen in einer Zeile anwendest, erzeugt die Anwendung des Formats auf das tr -Tag saubereren und präziseren HTML-Code.

Barrierefreiheits-Attribute für eine Tabelle in der Code-Ansicht hinzufügen oder bearbeiten

Bearbeite die entsprechenden Attribute im Code.
Anmerkung

Um die Tags im Code schnell zu finden, klicke in die Tabelle und wähle dann das <table> -Tag in der Tag-Auswahl am unteren Rand des Dokumentfensters aus.

Barrierefreiheit-Werte für eine Tabelle in der Designansicht hinzufügen oder bearbeiten

  • Um die Tabellenüberschrift zu bearbeiten, markiere die Überschrift und gib eine neue Überschrift ein.
    • Um die Beschriftungsausrichtung zu bearbeiten, platziere die Einfügemarke in der Tabellenbeschriftung, klicke mit der rechten Maustaste (Windows) oder bei gedrückter Strg-Taste (Macintosh) und wähle dann Tag-Code bearbeiten aus.

    • Um die Tabellenzusammenfassung zu bearbeiten, wähle die Tabelle aus, klicke mit der rechten Maustaste (Windows) oder bei gedrückter Strg-Taste (Macintosh) und wähle dann Tag-Code bearbeiten aus.

Größe von Tabellen, Spalten und Zeilen ändern

Tabellen vergrößern oder verkleinern

Du kannst die Größe einer gesamten Tabelle oder einzelner Zeilen und Spalten ändern.Wenn du die Größe einer gesamten Tabelle änderst, ändern sich alle Zellen in der Tabelle proportional.Wenn die Zellen einer Tabelle explizite Breiten oder Höhen haben, ändert die Größenänderung der Tabelle die visuelle Größe der Zellen im Dokument-Fenster, aber nicht die angegebenen Breiten und Höhen der Zellen.

Du kannst die Größe einer Tabelle ändern, indem du einen ihrer Auswahlgriffe ziehst.Dreamweaver zeigt die Tabellenbreite zusammen mit einem Tabellen-Header-Menü am oberen oder unteren Rand der Tabelle an, wenn die Tabelle ausgewählt ist oder sich die Einfügemarke in der Tabelle befindet.

Manchmal stimmen die in den HTML-Code gesetzten Spaltenbreiten nicht mit ihrer scheinbaren Breite auf dem Bildschirm überein.Wenn das passiert, kannst du die Breiten konsistent machen.Tabellen- und Spaltenbreiten und Header-Menüs erscheinen in Dreamweaver, um dir beim Layout deiner Tabellen zu helfen; du kannst die Breiten und Menüs nach Bedarf aktivieren oder deaktivieren.

Spalten und Zeilen vergrößern oder verkleinern

Du kannst die Breite einer Spalte oder die Höhe einer Zeile im Eigenschafteninspektor oder durch Ziehen der Ränder der Spalte oder Zeile ändern.Wenn du Probleme beim Ändern der Größe hast, kannst du die Spaltenbreiten oder Zeilenhöhen zurücksetzen und neu anfangen.

Anmerkung

Du kannst Zellenbreiten und -höhen auch direkt im HTML-Code mit der Code-Ansicht ändern.

Dreamweaver zeigt Spaltenbreiten zusammen mit Spalten-Header-Menüs am oberen oder unteren Rand der Spalten an, wenn die Tabelle ausgewählt ist oder sich die Einfügemarke in der Tabelle befindet; du kannst die Spalten-Header-Menüs nach Bedarf aktivieren oder deaktivieren.

Größe von Tabellen ändern

Wählen Sie die Tabelle aus. Wenn Sie sich in der Live-Ansicht befinden, wird beim Auswählen der Tabelle die Elementanzeige angezeigt. Klicke auf das Sandwich-Icon, um in den Tabellenformatierungsmodus zu wechseln.

  • Um die Größe der Tabelle horizontal zu ändern, ziehe den Auswahlgriff auf der rechten Seite.

  • Um die Größe der Tabelle vertikal zu ändern, ziehe den Auswahlgriff unten.

  • Um die Größe der Tabelle in beiden Dimensionen zu ändern, ziehe den Auswahlgriff in der unteren rechten Ecke.

Wenn Sie den Modus zum Formatieren von Tabellen in der Live-Ansicht verlassen möchten, drücken Sie die Esc-Taste oder klicken Sie auf eine Stelle außerhalb der Tabelle. Du kannst die Menüoptionen Bearbeiten > Tabelle verwenden, um die Tabelle weiter zu ändern.

Hinweis: Die Optionen unter „Bearbeiten“ > „Tabelle“ variieren in Abhängigkeit davon, ob Sie die gesamte Tabelle oder eine einzelne Zelle ausgewählt haben. In der Live-Ansicht wird in der Elementanzeige bei Auswahl der gesamten Tabelle „table“ angezeigt. Bei Auswahl einer bestimmten Zelle wird „td“ angezeigt. Um vom Zellenformatierungs- in den Tabellenformatierungsmodus zu wechseln, klicke auf den Tabellenrand.

Ändere die Breite einer Spalte und behalte die Gesamttabellenbreite bei

Ziehe in der Designansicht den rechten Rand der Spalte, die du ändern möchtest.

Die Breite der benachbarten Spalte ändert sich ebenfalls, sodass du tatsächlich zwei Spalten in der Größe änderst.Visuelles Feedback zeigt dir, wie sich die Spalten anpassen werden; die Gesamttabellenbreite ändert sich nicht.

Spaltenbreite ändern und dabei die Tabellenbreite beibehalten

Anmerkung

In Tabellen mit prozentbasierten Breiten (nicht Pixel) ändert sich beim Ziehen des rechten Randes der rechtesten Spalte die Breite der gesamten Tabelle, und alle Spalten werden proportional breiter oder schmaler.

Ändere die Breite einer Spalte und behalte die Größe der anderen Spalten bei

Halte in der Entwurfsansicht die Umschalttaste gedrückt und ziehe den Rahmen der Spalte.

Die Breite dieser Spalte ändert sich. Visuelles Feedback zeigt dir, wie sich die Spalten anpassen; die Gesamtbreite der Tabelle ändert sich um die Spalte zu berücksichtigen, deren Größe du änderst.

Spaltenbreite ändern und dabei die Breite anderer Spalten beibehalten

Höhe von Zeilen ändern

Ziehen Sie den unteren Rand der entsprechenden Zeile.

Sorge dafür, dass die Spaltenbreiten im Code mit den visuellen Breiten übereinstimmen

Klicken Sie in eine Zelle.
Klicke auf das Tabellen-Header-Menü und wähle dann Alle Breiten konsistent machen aus.

Dreamweaver setzt die im Code angegebene Breite zurück, damit sie mit der visuellen Breite übereinstimmt.

Alle festgelegten Breiten oder Höhen in einer Tabelle löschen

Wählen Sie die Tabelle aus.
Führen Sie einen der folgenden Schritte aus:
  • Wähle Bearbeiten > Tabelle > Zellenbreiten löschen oder Bearbeiten > Tabelle > Zellenhöhen löschen aus.

  • Klicken Sie im Eigenschafteninspektor („Fenster“ > „Eigenschaften“) auf die Schaltfläche „Zeilenhöhen löschen“  oder „Spaltenbreiten löschen“ .

  • Klicke auf das Tabellen-Header-Menü und wähle dann Alle Höhen löschen oder Alle Breiten löschen aus.

Festgelegte Breite von Spalten löschen

Klicke in die Spalte, klicke auf das Spalten-Header-Menü und wähle Spaltenbreite löschen aus.

Aktiviere oder deaktiviere Tabellen- und Spaltenbreiten und Menüs in der Entwurfsansicht

Wähle Ansicht > Entwurfsansicht-Optionen > Visuelle Hilfsmittel > Tabellenbreiten aus.

Zeilen und Spalten hinzufügen und entfernen

Um Zeilen und Spalten hinzuzufügen und zu entfernen, verwende Ändern > Tabelle oder das Spalten-Header-Menü.

Anmerkung

Wenn du Tab in der letzten Zelle einer Tabelle drückst, wird automatisch eine weitere Zeile zur Tabelle hinzugefügt.

Einzelne Zeilen oder Spalten hinzufügen

Klicken Sie in eine Zelle und führen Sie einen der folgenden Schritte aus:
  • Wähle Bearbeiten > Tabelle > Zeile einfügen oder Bearbeiten > Tabelle > Spalte einfügen aus.

    Eine Zeile wird oberhalb der Einfügemarke und eine Spalte wird links neben der Einfügemarke eingefügt.

  • Klicken Sie auf das Spaltenüberschriftmenü und wählen Sie dann „Spalte links einfügen“ oder „Spalte rechts einfügen“ aus.

     

Mehrere Zeilen oder Spalten einfügen

Klicken Sie in eine Zelle.

Wähle Bearbeiten > Tabelle > Zeilen oder Spalten einfügen aus, vervollständige das Dialogfeld und klicke auf OK.

Einfügen:

Gibt an, ob Zeilen oder Spalten eingefügt werden.

Anzahl der Zeilen oder Anzahl der Spalten

Die Anzahl der einzufügenden Zeilen bzw. Spalten.

Wo

Gibt an, ob die neuen Zeilen oder Spalten vor oder nach der Zeile oder Spalte der ausgewählten Zelle erscheinen sollen.

Zeilen oder Spalten löschen

Führen Sie einen der folgenden Schritte aus:
  • Klicke in eine Zelle innerhalb der Zeile oder Spalte, die du löschen möchtest, und wähle dann Bearbeiten > Tabelle > Zeile löschen oder Bearbeiten > Tabelle > Spalte löschen aus.

  • Wähle eine vollständige Zeile oder Spalte aus und drücke dann Entf.

  • Führen Sie im Eigenschafteninspektor einen der folgenden Schritte aus:
    • Wenn Sie Zeilen einfügen oder löschen möchten, erhöhen oder verringern Sie den Wert in „Zeilen“.
    • Um Spalten hinzuzufügen oder zu löschen, erhöhe oder verringere den Wert für Spalten.
Anmerkung

Dreamweaver warnt dich nicht, wenn du Zeilen und Spalten löschst, die Daten enthalten.

Zellen verbinden und teilen

Verwende den Eigenschafteninspektor oder die Optionen im Untermenü Bearbeiten > Tabelle, um Zellen zu teilen oder zusammenzufassen.

Mehrere Zellen einer Tabelle verbinden

Wähle die Zellen in einer zusammenhängenden Linie und in der Form eines Rechtecks aus.

In der folgenden Illustration ist die Auswahl ein Rechteck von Zellen, sodass die Zellen zusammengeführt werden können.

In einem Rechteck von Zellen können die einzelnen Zellen verbunden werden

In der folgenden Illustration ist die Auswahl kein Rechteck, sodass die Zellen nicht zusammengeführt werden können.

Zellen können nicht verbunden werden, wenn die Auswahl kein Rechteck bildet

Führen Sie einen der folgenden Schritte aus:
  • Wähle Bearbeiten > Tabelle > Zellen zusammenführen.

  • Klicke im erweiterten HTML-Eigenschaftsinspektor (Fenster > Eigenschaften) auf Zellen zusammenführen.

Anmerkung

Falls du den Button nicht siehst, klicke auf den Erweiterungspfeil in der unteren rechten Ecke des Eigenschaftsinspektors, sodass du alle Optionen siehst.

Der Inhalt der einzelnen Zellen wird in die neue verbundene Zelle verschoben. Für die verbundene Zelle gelten die Eigenschaften der Zelle, die zuerst ausgewählt wurde.

Zellen teilen

Klicke in die Zelle und führe einen der folgenden Schritte aus:
  • Wähle Bearbeiten > Tabelle > Zelle teilen.

  • Klicke im erweiterten HTML-Eigenschaftsinspektor (Fenster > Eigenschaften) auf Zelle teilen.

Anmerkung

Wenn die Schaltfläche nicht angezeigt wird, klicken Sie auf den Erweiterungspfeil rechts unten im Eigenschafteninspektor, sodass alle Optionen angezeigt werden.

Lege im Dialogfeld Zelle teilen fest, wie die Zelle geteilt werden soll:

Zelle teilen in

Gibt an, ob die Zelle in Zeilen oder Spalten geteilt wird.

Anzahl der Zeilen/Anzahl der Spalten

Gibt an, in wie viele Zeilen oder Spalten die Zelle geteilt werden soll.

Die Anzahl der von einer Zelle umfassten Zeilen oder Spalten erhöhen oder verringern

Führen Sie einen der folgenden Schritte aus:
  • Wähle Bearbeiten > Tabelle > Zeilenspanne erhöhen oder Bearbeiten > Tabelle > Spaltenspanne erhöhen.

  • Wähle Bearbeiten > Tabelle > Zeilenspanne verringern oder Bearbeiten > Tabelle > Spaltenspanne verringern.

Zellen kopieren, einfügen und löschen

Du kannst eine einzelne Tabellenzelle oder mehrere Zellen gleichzeitig kopieren, einfügen oder löschen und dabei die Formatierung der Zellen beibehalten.

Du kannst Zellen an der Einfügemarke oder anstelle einer Auswahl in einer vorhandenen Tabelle einfügen. Um mehrere Tabellenzellen einzufügen, müssen die Inhalte der Zwischenablage mit der Struktur der Tabelle oder der Auswahl in der Tabelle kompatibel sein, in die die Zellen eingefügt werden.

Tabellenzellen ausschneiden oder kopieren

Wähle eine oder mehrere Zellen in einer zusammenhängenden Linie und in der Form eines Rechtecks aus.

In der folgenden Illustration ist die Auswahl ein Rechteck von Zellen, sodass die Zellen ausgeschnitten oder kopiert werden können.

In einem Rechteck von Zellen können Zellen ausgeschnitten oder kopiert werden

In der folgenden Illustration ist die Auswahl kein Rechteck, sodass die Zellen nicht ausgeschnitten oder kopiert werden können.

Zellen können nicht ausgeschnitten oder kopiert werden, wenn die Auswahl kein Rechteck bildet

Wählen Sie „Bearbeiten“ > „Ausschneiden“ oder „Bearbeiten“ > „Kopieren“.
Anmerkung

Falls du eine ganze Zeile oder Spalte ausgewählt hast und Bearbeiten > Ausschneiden wählst, wird die ganze Zeile oder Spalte aus der Tabelle entfernt (nicht nur der Inhalt der Zellen).

Tabellenzellen einfügen

Wählen Sie die Stelle aus, an der die Zellen eingefügt werden sollen:
  • Um vorhandene Zellen durch die eingefügten Zellen zu ersetzen, wählen Sie eine Gruppe vorhandener Zellen aus, die das gleiche Layout haben wie die Zellen in der Zwischenablage. (Wenn Sie beispielsweise einen Block mit 3 x 2 Zellen kopiert haben, können Sie einen anderen Block mit 3 x 2 Zellen auswählen, der durch Einfügen ersetzt wird.)

  • Um eine ganze Zeile mit Zellen über einer bestimmten Zelle einzufügen, klicken Sie in die entsprechende Zelle.

  • Um eine ganze Spalte mit Zellen links neben einer bestimmten Zelle einzufügen, klicken Sie in die entsprechende Zelle.

Anmerkung

Wenn sich in der Zwischenablage keine ganze Tabellenzeile oder -spalte befindet und Sie in eine Zelle klicken und dann die Zellen aus der Zwischenablage einfügen, werden möglicherweise die Zelle, in die Sie geklickt haben, und deren Nachbarzellen (je nach Position der Zelle in der Tabelle) durch die eingefügten Zellen ersetzt.

  • Um mit den eingefügten Zellen eine neue Tabelle zu erstellen, positionieren Sie die Einfügemarke außerhalb der Tabelle.
Wählen Sie „Bearbeiten“ > „Einfügen“ aus.

Falls du ganze Zeilen oder Spalten in eine vorhandene Tabelle einfügst, werden die Zeilen oder Spalten zur Tabelle hinzugefügt. Falls du eine einzelne Zelle einfügst, wird der Inhalt der ausgewählten Zelle ersetzt. Falls du außerhalb einer Tabelle einfügst, werden die Zeilen, Spalten oder Zellen zur Definition einer neuen Tabelle verwendet.

Zellinhalte entfernen, aber Zellen intakt lassen

Wählen Sie eine oder mehrere Zellen aus.
Anmerkung

Stelle sicher, dass die Auswahl nicht ausschließlich aus vollständigen Zeilen oder Spalten besteht.

Drücken Sie die Entf-Taste.

Anmerkung

Wenn du nur komplette Zeilen oder Spalten ausgewählt hast und Bearbeiten > Löschen wählst oder die Entf-Taste drückst, werden die gesamten Zeilen oder Spalten—nicht nur ihre Inhalte—aus der Tabelle entfernt.

Zeilen oder Spalten löschen, die zusammengeführte Zellen enthalten

Wählen Sie die Zeile oder Spalte aus.

Wähle Bearbeiten > Tabelle > Zeile löschen oder Bearbeiten > Tabelle > Spalte löschen.

Tabellen verschachteln

Eine verschachtelte Tabelle ist eine Tabelle innerhalb einer Zelle einer anderen Tabelle.Du kannst eine verschachtelte Tabelle wie jede andere Tabelle formatieren; ihre Breite ist jedoch durch die Breite der Zelle begrenzt, in der sie erscheint.

Klicken Sie in eine Zelle der vorhandenen Tabelle.
Wähle Einfügen > Tabelle, lege die Optionen für Tabelle einfügen fest und klicke auf OK.

Tabellen sortieren

Du kannst die Zeilen einer Tabelle basierend auf den Inhalten einer einzelnen Spalte sortieren.Du kannst auch eine kompliziertere Tabellensortierung basierend auf den Inhalten zweier Spalten durchführen.

Du kannst keine Tabellen sortieren, die colspan- oder rowspan-Attribute enthalten—das heißt, Tabellen, die verbundene Zellen enthalten.

Wählen Sie die Tabelle aus oder klicken Sie in eine beliebige Zelle.

Wähle Bearbeiten > Tabelle > Tabelle sortieren, lege die Optionen im Dialogfeld fest und klicke auf OK.

Sortieren nach

Bestimmt, welche Spaltenwerte verwendet werden, um die Tabellenzeilen zu sortieren.

Reihenfolge

Bestimmt, ob die Spalte alphabetisch oder numerisch sortiert werden soll und ob sie in aufsteigender Reihenfolge (A bis Z, niedrigere zu höheren Zahlen) oder absteigender Reihenfolge sortiert werden soll.

Wenn der Inhalt einer Spalte aus Zahlen besteht, wähle Numerisch.Eine alphabetische Sortierung, die auf eine Liste von ein- und zweistelligen Zahlen angewendet wird, führt dazu, dass die Zahlen sortiert werden, als wären sie Wörter (was zu einer Reihenfolge wie 1, 10, 2, 20, 3, 30 führt), anstatt als Zahlen sortiert zu werden (was zu einer Reihenfolge wie 1, 2, 3, 10, 20, 30 führt).

Dann nach/Reihenfolge

Bestimmt die Sortierreihenfolge für eine Sekundär-Sortierung in einer anderen Spalte.Gib die Sekundär-Sortierspalte im Dann nach-Popup-Menü und die sekundäre Sortierreihenfolge in den Reihenfolge-Popup-Menüs an.

Erste Zeile beim Sortieren berücksichtigen

Gibt an, dass die erste Zeile der Tabelle in die Sortierung einbezogen werden soll.Wenn die erste Zeile eine Überschrift ist, die nicht verschoben werden soll, wähle diese Option nicht aus.

Kopfzeilen sortieren

Gibt an, dass alle Zeilen im thead-Abschnitt der Tabelle (falls vorhanden) mit denselben Kriterien wie die Zeilen im Tabellenkörper sortiert werden sollen.(Beachte, dass thead-Zeilen im thead-Abschnitt verbleiben und auch nach der Sortierung noch oben in der Tabelle erscheinen.)Für Informationen über den thead-Tag siehe das Referenz-Bedienfeld (wähle Hilfe > Referenz).

Fußzeilen sortieren

Gibt an, dass alle Zeilen im tfoot-Abschnitt der Tabelle (falls vorhanden) mit denselben Kriterien wie die Zeilen im Tabellenkörper sortiert werden sollen.(Beachte, dass tfoot-Zeilen im tfoot-Abschnitt verbleiben und auch nach der Sortierung noch unten in der Tabelle erscheinen.)Für Informationen über den tfoot-Tag siehe das Referenz-Bedienfeld (wähle Hilfe > Referenz).

Alle Zeilenfarben nach dem Sortieren beibehalten

Gibt an, dass Tabellenzeilen-Attribute (wie Farbe) nach der Sortierung mit demselben Inhalt verknüpft bleiben sollen.Wenn deine Tabellenzeilen mit zwei wechselnden Farben formatiert sind, wähle diese Option nicht aus, um sicherzustellen, dass die sortierte Tabelle weiterhin abwechselnd gefärbte Zeilen hat. Wenn die Zeilenattribute spezifisch für den Inhalt jeder Zeile sind, dann wähle diese Option aus, um sicherzustellen, dass diese Attribute mit den korrekten Zeilen in der sortierten Tabelle verknüpft bleiben.