HTML - Element: <colgroup>

Mit dem <colgroup>-Tag und dem <col>-Tag können Sie Tabellenspalten vordefinieren. Damit können Sie dem Browser gleich zu Beginn der Tabelle mitteilen, wie viele Spalten die Tabelle hat, und wie breit diese ist. Dadurch kann der Browser große Tabellen schneller aufbauen.

Mit dem Attribut width="100" / width="100%" geben Sie die Breite (in Pixel / in Prozent) von <colgroup> und <col> an.

<!DOCTYPE html>
<html>
<head>
 <title>Tabellenspalten vordefinieren</title>
</head>
<body>

<h1>Tabellenspalten vordefinieren</h1>

<table border="1">
 <colgroup>
  <col span="2" style="background-color: Lightskyblue">
  <col style="background-color: Yellow">
 </colgroup>
 <tr>
   <th>ISBN</th>
   <th>Titel</th>
   <th>Preis</th>
 </tr>
 <tr>
  <td>3476896</td>
  <td>Das Blindtextchen.</td>
  <td>56 €</td>
 </tr>
 <tr>
  <td>5869207</td>
  <td>Das Blindtextchen kommt zurück.</td>
  <td>48 €</td>
 </tr>
</table>

</body>
</html>

Beispiel anzeigen

Bausteine Alle Anzeigen

Eine zufällige Auswahl von Codeschnipseln aus den Bereichen HTML, CSS, PHP, JavaScript und MySQL.

<td> Tabellenspalte

CSS - Hintergrundbild mit Zoom Funktion

PHP - CSRF-Token für Formulare erstellen

JavaScript - Formularfelder dynamisch hinzufügen (2)

MySQL - Suchen und Ersetzen in einer Tabellenspalte

Keine Passwörter
Möglichst auf Passwortsperren verzichten. Ein Besucher sammelt mit der Zeit einen Berg an Benutzernamen und Zugangscodes an. Mit der Zeit kommt er durcheinander und vergißt möglicherweise die Daten. Dann haben Sie einen Leser verloren. Und: Erspare es dem Besucher, gigantische Fragebögen auszufüllen.