Das HTML <col>-Element definiert eine Spalte innerhalb einer Tabelle und wird zum Definieren einer gemeinsamen Semantik für alle gängigen Zellen verwendet. Es wird allgemein innerhalb eines <colgroup> -Elements gefunden.
 
Auf dieses Element können CSS-Stilvorschriften für das Design von Spalten angewendet werden, aber nur wenige Attribute wirken sich auf die Spalte aus (siehe die CSS 2.1-Spezifikation für eine Liste).
Inhaltskategorien Keine
Erlaubter Inhalt Keiner, es ist ein empty element
Tag-Auslassung Das Start-Tag ist obligatorisch, aber da es sich um ein void-Element handelt, ist die Verwendung eines End-Tags nicht zulässig.
Erlaubte Elternelemente Nur <colgroup>, obwohl es implizit definiert werden kann, da sein Start-Tag nicht obligatorisch ist. Das <colgroup> darf kein span - Attribut haben.
Zulässige ARIA-Rollen Keine
DOM Schnittstelle HTMLTableColElement

Attribute

Dieses Element enthält die globalen Attribute

align Unerwünscht HTML4.01, Veraltet seit HTML5
Dieses Aufzählungsattribut gibt an, wie die horizontale Ausrichtung der einzelnen Spaltenzelleninhalte behandelt wird. Mögliche Werte sind:
  • left, richtet den Inhalt links von der Zelle aus
  • center, zentriert den Inhalt in der Zelle
  • right, richtet den Inhalt auf der rechten Seite der Zelle aus
  • justify, einfügen von Leerzeichen in den Textinhalt, so dass der Inhalt in der Zelle gerechtfertigt ist
  • char, richtet den Textinhalt auf ein Sonderzeichen mit einem minimalen Offset aus, definiert durch htmlattrxref <char>, <col> und htmlattrxref <charoff>, <col> Attribute ; nicht implementiert_inline (2212).

Wenn dieses Attribut nicht gesetzt ist, wird der Wert von align des <colgroup> -Elements geerbt, zu dem dieses <col> -Element gehört. Wenn es keine gibt, wird der Wert left angenommen.

Note: Verwenden Sie dieses Attribut nicht, da es im neuesten Standard veraltet (nicht unterstützt) ist.
  •  Um den gleichen Effekt zu erzielen wie die Werte left, center, right or justify:
    • Versuchen Sie nicht, die Eigenschaft text-align in einem Selektor festzulegen, der ein  <col> enthält. Da <td> nicht von <col>-Element abhängen, werden sie nicht übernommen..
    • Wenn die Tabelle keines der colspan-Attribute verwendet, benutzen Sie bitte den td:nth-child(an+b)-CSS-Selektoren. Setzen Sie a auf null und b auf die Position der Tabellenspalte, z.B. td:nth-child(2) { text-align: right; }, um die zweite Zeile rechts auszurichten.
    • Wenn die Tabelle ein Attribut colspan verwendet, kann der Effekt durch Kombination geeigneter CSS-Attributselektoren wie [colspan = n] erzielt werden, obwohl dies nicht trivial ist.
  • Um den gleichen Effekt wie den char-Wert zu erzielen, können Sie in CSS3 den Wert von char als Wert von text-align verwenden.(Inline nicht implementiert)  .
bgcolor
Dieses Attribut definiert die Hintergrundfarbe jeder Zelle der Spalte. Zugelassene Werte sind jeweils einer der 6-stelligen Hexadezimalcodes, wie in sRGB definiert wurden, immer mit einem '#' vorangestellt. Außerdem kann einer der sechzehn vordefinierten Farbstrings verwendet werden:
  black = "#000000"   green = "#008000"
  silver = "#C0C0C0"   lime = "#00FF00"
  gray = "#808080"   olive = "#808000"
  white = "#FFFFFF"   yellow = "#FFFF00"
  maroon = "#800000"   navy = "#000080"
  red = "#FF0000"   blue = "#0000FF"
  purple = "#800080"   teal = "#008080"
  fuchsia = "#FF00FF"   aqua = "#00FFFF"
Hinweis zur Verwendung: Verwenden Sie dieses Attribut nicht, da es nicht standardgemäß ist und nur in einigen Versionen von Microsoft Internet Explorer implementiert ist: Das Element <col> sollte mit CSS formatiert werden. Verwenden Sie die CSS-Eigenschaft background-color in den relevanten <td>-Elementen, um einen mit dem bgcolor-Attribut vergleichbaren Effekt zu erzielen.
char Unerwünscht HTML4.01, Veraltet seit HTML5
 

Dieses Attribut wird verwendet, um das Zeichen festzulegen, an dem die Zellen in einer Spalte ausgerichtet werden sollen. Typische Werte hierfür sind ein Punkt (.) Beim Ausrichten von Zahlen oder Geldwerten. Wenn align nicht auf char gesetzt ist, wird dieses Attribut ignoriert;

 
Anmerkung: Verwenden Sie dieses Attribut nicht, da es im neuesten Standard veraltet (und nicht unterstützt) ist. Um den gleichen Effekt wie bei char zu erzielen, können Sie in CSS3 den Zeichensatz mit dem char Attribut als Wert der Eigenschaft text-align einsetzen.
charoff Unerwünscht HTML4.01, Veraltet seit HTML5
Dieses Attribut gibt die Anzahl der Zeichen an, die die Spaltendaten von den vom char-Attribut angegebenen Ausrichtungszeichen versetzen sollen
Anmerkung: Verwenden Sie dieses Attribut nicht, da es im aktuellen Standard veraltet (und nicht unterstützt) ist.
span
Dieses Attribut enthält eine positive ganze Zahl, die die Anzahl aufeinanderfolgender Spalten angibt, die das <col> -Element überspannt. Wenn nicht vorhanden, ist der Standardwert 1.
valign Unerwünscht HTML4.01, Veraltet seit HTML5
Dieses Attribut gibt die vertikale Ausrichtung des Texts in jeder Zelle der Spalte an. Mögliche Werte für dieses Attribut sind:
  • baseline, setzt den Text so nahe wie möglich an den unteren Rand der Zelle , richtet ihn aber an der Grundlinie der Zeichen anstatt am unteren Rand aus. Wenn alle Zeichen dieselbe Größe haben, hat dies den gleichen Effekt wie bottom
  • bottom, setzt den Text so nahe wie möglich an den unteren Rand der Zelle
  • middle, zentriert den Text in der Zelle
  • top, setzt den Text so nahe wie möglich an den oberen Rand der Zelle
Anmerkung: Verwenden Sie dieses Attribut nicht, da es im neuesten Standard veraltet (und nicht unterstützt) ist:
  • Versuchen Sie nicht, die Eigenschaft vertical-align in einem Selektor festzulegen, der ein HTMLElement <col> enthält. Da das <td>-Element nicht vom <col>-Element abhängt, werden sie nicht vererbt.
  • Wenn die Tabelle kein colspan - Attribut verwendet, verwenden Sie den CSS-Selektor td: nth-child (an + b), wobei a die Gesamtanzahl der Spalten in der Tabelle ist und b ist die Ordnungsposition der Spalte in der Tabelle. Erst nach diesem Selektor kann die Eigenschaft cssxref vertical-align verwendet werden.
  • Wenn die Tabelle ein colspan- Attribut verwendet, kann der Effekt durch Kombination geeigneter CSS-Attributselektoren wie [colspan = n] erzielt werden, obwohl dies nicht trivial ist.
width Veraltet seit HTML5
Dieses Attribut gibt eine Standardbreite für jede Spalte in der aktuellen Spaltengruppe an. Zusätzlich zu den Standardpixel- und -prozentwerten kann dieses Attribut das Sonderformat 0 * annehmen, was bedeutet, dass die Breite jeder Spalte in der Gruppe die minimale Breite sein sollte, die erforderlich ist, um den Inhalt der Spalte aufzunehmen. Relative Breiten wie 0,5 * können ebenfalls verwendet werden.

Beispiel

Auf der Seite <table> finden Sie Beispiele für <col>.

Spezifikationen

Spezifikation Status Comment
HTML Living Standard
Die Definition von '<col>' in dieser Spezifikation.
Lebender Standard  
HTML5
Die Definition von '<col>' in dieser Spezifikation.
Empfehlung  
HTML 4.01 Specification
Die Definition von '<col>' in dieser Spezifikation.
Empfehlung Initiale Definition

Browser-Kompatibilität

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid WebviewChrome für AndroidEdge MobileFirefox für AndroidOpera für AndroidiOS SafariSamsung Internet
Grundlegende UnterstützungChrome Vollständige Unterstützung 1Edge Vollständige Unterstützung JaFirefox Vollständige Unterstützung 1IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaEdge Mobile Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
align
Veraltet
Chrome ? Edge Vollständige Unterstützung JaFirefox Keine Unterstützung Nein
Hinweise
Keine Unterstützung Nein
Hinweise
Hinweise See bug 915.
IE Vollständige Unterstützung JaOpera ? Safari ? WebView Android ? Chrome Android ? Edge Mobile Vollständige Unterstützung JaFirefox Android Keine Unterstützung Nein
Hinweise
Keine Unterstützung Nein
Hinweise
Hinweise See bug 915.
Opera Android ? Safari iOS ? Samsung Internet Android ?
bgcolor
Veraltet
Chrome ? Edge Keine Unterstützung NeinFirefox Keine Unterstützung NeinIE Vollständige Unterstützung JaOpera ? Safari ? WebView Android ? Chrome Android ? Edge Mobile Keine Unterstützung NeinFirefox Android Keine Unterstützung NeinOpera Android ? Safari iOS ? Samsung Internet Android ?
char
Veraltet
Chrome ? Edge Vollständige Unterstützung JaFirefox Keine Unterstützung Nein
Hinweise
Keine Unterstützung Nein
Hinweise
Hinweise See bug 2212.
IE Vollständige Unterstützung JaOpera ? Safari ? WebView Android ? Chrome Android ? Edge Mobile Vollständige Unterstützung JaFirefox Android Keine Unterstützung Nein
Hinweise
Keine Unterstützung Nein
Hinweise
Hinweise See bug 2212.
Opera Android ? Safari iOS ? Samsung Internet Android ?
charoff
Veraltet
Chrome ? Edge Vollständige Unterstützung JaFirefox Keine Unterstützung Nein
Hinweise
Keine Unterstützung Nein
Hinweise
Hinweise See bug 2212.
IE Vollständige Unterstützung JaOpera ? Safari ? WebView Android ? Chrome Android ? Edge Mobile Vollständige Unterstützung JaFirefox Android Keine Unterstützung Nein
Hinweise
Keine Unterstützung Nein
Hinweise
Hinweise See bug 2212.
Opera Android ? Safari iOS ? Samsung Internet Android ?
spanChrome Vollständige Unterstützung 1Edge Vollständige Unterstützung JaFirefox Vollständige Unterstützung 1IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaEdge Mobile Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja
valign
Veraltet
Chrome ? Edge Vollständige Unterstützung JaFirefox Keine Unterstützung Nein
Hinweise
Keine Unterstützung Nein
Hinweise
Hinweise See bug 915.
IE Vollständige Unterstützung JaOpera ? Safari ? WebView Android ? Chrome Android ? Edge Mobile Vollständige Unterstützung JaFirefox Android Keine Unterstützung Nein
Hinweise
Keine Unterstützung Nein
Hinweise
Hinweise See bug 915.
Opera Android ? Safari iOS ? Samsung Internet Android ?
width
Veraltet
Chrome Vollständige Unterstützung 1Edge Vollständige Unterstützung JaFirefox Vollständige Unterstützung 1IE Vollständige Unterstützung JaOpera Vollständige Unterstützung JaSafari Vollständige Unterstützung JaWebView Android Vollständige Unterstützung JaChrome Android Vollständige Unterstützung JaEdge Mobile Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 4Opera Android Vollständige Unterstützung JaSafari iOS Vollständige Unterstützung JaSamsung Internet Android Vollständige Unterstützung Ja

Legende

Vollständige Unterstützung  
Vollständige Unterstützung
Keine Unterstützung  
Keine Unterstützung
Kompatibilität unbekannt  
Kompatibilität unbekannt
Veraltet. Nicht für den Einsatz in neuen Webseiten gedacht.
Veraltet. Nicht für den Einsatz in neuen Webseiten gedacht.
Siehe Implementierungshinweise.
Siehe Implementierungshinweise.

Siehe auch

  • Andere tabellenbezogene HTML-Elemente: <caption>, <colgroup>, <table>, <tbody>, <td>, <tfoot>, <th>, <thead>, <tr>;
  • CSS-Eigenschaften und Pseudoklassen, die besonders nützlich sein können, um das <col> -Element zu formatieren:
    • Die Eigenschaft width , um die Breite der Spalte zu steuern;
    • Die Pseudoklasse :nth-child , um die Ausrichtung auf die Zellen der Spalte festzulegen;
    • Die  text-align -Eigenschaft, um den Inhalt aller Zellen auf dasselbe Zeichen wie '.'.

Schlagwörter des Dokuments und Mitwirkende

Mitwirkende an dieser Seite: RmnWtnkmp, dio, grandmalovesyou
Zuletzt aktualisiert von: RmnWtnkmp,