HTML Teil 18 Anleitung HTML Tabellen

Um eine HTML Tabelle zu erstellen gibt es diese Tags:

<table> </table> Erstellt den Rahmen der Tabelle außen.
<tr> </tr> Erstellt ein Zeile in der Tabelle.
<td> </td> Erstellt eine Spalte in der Tabelle.
<th> </th> rstellt die Überschrift einer Spalte.
<caption> </caption> Erstellt eine Überschrift für die Tabelle.

Aufteilung der Tabelle in 3 Bereiche.

Man kann eine Tabelle auch in drei Teile, Kopf <thead>, Hauptbereich <tbody> und eine Fußzeile <tfoot> im <table> Tag aufteilen. Die Reihenfolge im Code ist egal, es wird immer in der Reihe 1 <thead> 2 <tbody> 3 <tfoot> angezeigt.

HTML Tabellen Attribute

<th colspan=“2“>Text</th>  Im Tag <th> für Überschrift erstellt man eine Überschrift über 2 Spalten.

<th rowspan=“2″>Text</th> Erstellt man eine Bezeichnung (Überschrift) für 2 Zeilen.

HTML Tabellen Style

<colgroup>

<colgroup> <!– Spalten in Gruppen teilen und einen Style zuweisen.–>

<col span=“2″ style=“background-color:blue“> <!– span = Über 2 Spalten die Hintergrundfarbe Blau zuweisen.–>

<col style=“background-color:yellow“> <!–Nächste Spalte Gelb.–>

<col style=“background-color:green“>  <!–Nächte Saplte Grün. –>

  </colgroup>

Tabelle Rahmen und 100% Breite.

<table border=“1″ style=“width:100%“>..</table>

Ohne dem Attribute width:100% werden die Spalten so breit, wieder Inhalt.

 

Tabelle Style zu weisen über CSS oder im Style Bereich:

Tabelle mit einem 1px starken Rahmen. (Der Rahmen ist um jede Zelle)

Tabelle mit einem 1px starken Rahmen.(Nur ein Rahmen ist zu sehen zwischen den Zellen)

Den Text auf die rechte Seite stellen:

text-align: right;

Leerraum zwischen den Zellen erstellen:

border-spacing: 30px;

Beispiel HTML Tabelle:

 

Freizeit

Montag Dienstag Mittwoch Donnerstag Freitag
Max
Peter Maria

 

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

*