HTML/Tabellen/Zellen verbinden

Aus SELFHTML-Wiki
< HTML | Tabellen(Weitergeleitet von Rowspan)
Wechseln zu: Navigation, Suche

[Bearbeiten] Zellen in einer Zeile verbinden - colspan

  • IE
  • Opera
  • Firefox
  • Safari
  • Chrome
  • HTML 2.0
  • XHTML 1.0
  • HTML5

Das Attribut colspan (deutsch: Spalte überspannen) erlaubt es, eine Tabellenzelle nach rechts über mehrere Spalten auszudehnen.

Beispiel ansehen …
<tbody>
  <tr><td>            1. Sp.</td>             <td>2. Sp.</td> <td>3. Sp.</td> <td>4. Sp.</td></tr>
  <tr><td colspan="3">1. Sp.</td>                                             <td>4. Sp.</td></tr>
  <tr><td>            1. Sp.</td> <td colspan="3">2. Sp.</td>                                </tr>
  <tr><td>            1. Sp.</td>             <td>2. Sp.</td> <td>3. Sp.</td> <td>4. Sp.</td></tr>
</tbody>
Beachten Sie, dass überspannte Zellen in der Zeile fehlen müssen.

[Bearbeiten] Zellen in einer Spalte verbinden - rowspan

  • IE
  • Opera
  • Firefox
  • Safari
  • Chrome
  • HTML 2.0
  • XHTML 1.0
  • HTML5

Das Attribut rowspan (deutsch: Zeile überspannen) erlaubt es, eine Tabellenzelle nach unten über mehrere Zeilen auszudehnen.

Beispiel ansehen …
<tbody>
  <tr><td>            1. Spalte</td> <td>            2. Spalte</td> <td>3. Spalte</td></tr>
  <tr><td rowspan="3">1. Spalte</td> <td>            2. Spalte</td> <td>3. Spalte</td></tr>
  <tr>                               <td rowspan="3">2. Spalte</td> <td>3. Spalte</td></tr>
  <tr>                                                              <td>3. Spalte</td></tr>
  <tr><td>            1. Spalte</td>                                <td>3. Spalte</td></tr>
</tbody>
Beachten Sie, dass bereits überspannte Zellen in den Folgezeilen fehlen müssen.

[Bearbeiten] Kombination von colspan und rowspan

Beispiel ansehen …
<tbody>
  <tr><td>                        1. Spalte</td> <td>2. Spalte</td> <td>3. Spalte</td></tr>
  <tr><td rowspan="3" colspan="2">1. Spalte</td>                    <td>3. Spalte</td></tr>
  <tr>                                                              <td>3. Spalte</td></tr>
  <tr>                                                              <td>3. Spalte</td></tr>
  <tr><td>1. Spalte</td>                         <td>2. Spalte</td> <td>3. Spalte</td></tr>
</tbody>
Meine Werkzeuge
Namensräume

Varianten
Aktionen
Übersicht
Index
Mitmachen
Werkzeuge
Spenden
SELFHTML