Platziere die Einfügemarke dort, wo die Tabelle erscheinen soll.
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.
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:
- Zellen
- Zeilen
- 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.
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.
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.
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.
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.
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.
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.
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.
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.
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.
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
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.)
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.
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
Einzelne Spalten auswählen
Einzelne Zellen auswählen
- 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
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.
Nicht aneinandergrenzende Zellen auswählen
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
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“.
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.
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.
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.
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.
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.
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.
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.
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.
Du kannst Breiten und Höhen als Pixel oder Prozentangaben angeben und von Pixeln zu Prozentangaben konvertieren und umgekehrt.
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.
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.
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
Weitere Informationen zu den Optionen erhältst du, wenn du auf das Hilfesymbol im Eigenschafteninspektor klickst.
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
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.
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.
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.
Höhe von Zeilen ändern
Sorge dafür, dass die Spaltenbreiten im Code mit den visuellen Breiten übereinstimmen
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ä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
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ü.
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
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
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
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.
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
In der folgenden Illustration ist die Auswahl ein Rechteck von Zellen, sodass die Zellen zusammengeführt werden können.
In der folgenden Illustration ist die Auswahl kein Rechteck, sodass die Zellen nicht zusammengeführt werden können.
Wähle Bearbeiten > Tabelle > Zellen zusammenführen.
Klicke im erweiterten HTML-Eigenschaftsinspektor (Fenster > Eigenschaften) auf Zellen zusammenführen.
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
Wähle Bearbeiten > Tabelle > Zelle teilen.
Klicke im erweiterten HTML-Eigenschaftsinspektor (Fenster > Eigenschaften) auf Zelle teilen.
Wenn die Schaltfläche nicht angezeigt wird, klicken Sie auf den Erweiterungspfeil rechts unten im Eigenschafteninspektor, sodass alle Optionen angezeigt werden.
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
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
In der folgenden Illustration ist die Auswahl ein Rechteck von Zellen, sodass die Zellen ausgeschnitten oder kopiert werden können.
In der folgenden Illustration ist die Auswahl kein Rechteck, sodass die Zellen nicht ausgeschnitten oder kopiert werden können.
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
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.
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.
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
Stelle sicher, dass die Auswahl nicht ausschließlich aus vollständigen Zeilen oder Spalten besteht.
Drücken Sie die Entf-Taste.
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ä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.
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ä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.
Erstellen ansprechender Websites in Dreamweaver
Entwirf, code und verwalte dynamische Websites mit einem leistungsstarken All-in-one-Tool.