 | Die Tabellenzurück |
Auf einer Homepage kann man sehr viel mit Tabellen anstellen. Man kann sie "unsichtbar" machen und als Absätze verwenden. Man kann verschiedene Hintergründe machen in allem und ganzem sind Tabellen eins der wichtigsten Html-Tags. Ein Beispiel:
<table>
<tr><td>Zelle1</td><td>Zelle2</td></tr>
<tr><td>Zelle3</td><td>Zelle4</td></tr>
</table>
und daraus wird:
| Zelle1 | Zelle2 |
| Zelle3 | Zelle4 |
Mit <table> beginnt man die Tabelle. Jede Zeile wird mit <tr> eingeleitet.
Du eröffnest eine Zelle mit <td>. Wie gewöhnlich bei HTML musst du auch alles wieder schließen.
Du denkst jetzt bestimmt na super das hätte ich auch ohne Tabellen hinbekommen. Deswegen färbe ich jetzt
einmal den Tabellen Hintergrund. Kannst du das auch noch ohne Tabellen?
<table bgcolor="#FF00FF">
<tr><td>Zelle1</td><td>Zelle2</td></tr>
<tr><td>Zelle3</td><td>Zelle4</td></tr>
</table>
und daraus wird:
| Zelle1 | Zelle2 |
| Zelle3 | Zelle4 |
Du kannst auch einzelne Zeilen anders färben:
<table>
<tr bgcolor="#FF00FF"><td>Zelle1</td><td>Zelle2</td></tr>
<tr bgcolor="#FFFF00"><td>Zelle3</td><td>Zelle4</td></tr>
</table>
daraus wird:
| Zelle1 | Zelle2 |
| Zelle3 | Zelle4 |
Du kannst auch jede Zellen einzeln färben, da musst du einfach nur das bgcolor anstatt in dem <tr> Tag in den <td> Tag packen, das wird im nächsten Beispiel gezeigt. Du merkst bestimmt, dass zwischen den Zellen weiße Zellen sind. Das kommt daher, dass die Zellen einen Standart-Abstand haben. Das änderst du so:
<table cellpadding="0" cellspacing="0">
<tr><td bgcolor="#FF00FF">Zelle1</td>
<td bgcolor="#00FFFF">Zelle2</td></tr>
<tr><td bgcolor="#FFFF00">Zelle3</td>
<td bgcolor="#00FF00">Zelle4</td></tr>
</table>
Das kommt raus:
| Zelle1 | Zelle2 |
| Zelle3 | Zelle4 |
Jetzt zeige ich dir, wie man auch noch Ränder einfügt:
<table border="2" cellpadding="0" cellspacing="0">
<tr><td bgcolor="#FF00FF">Zelle1</td>
<td bgcolor="#00FFFF">Zelle2</td></tr>
<tr><td bgcolor="#FFFF00">Zelle3</td>
<td bgcolor="#00FF00">Zelle4</td></tr>
</table>
Das kommt raus:
| Zelle1 | Zelle2 |
| Zelle3 | Zelle4 |
Du fragst dich jetzt vielleicht ob man die Tabelle auch noch vergrößern kann. Man kann eine feste Größe einstellen. Die Begriffe lernst du bald genauer kennen.
<table border="2" cellpadding="0" cellspacing="0">
<tr height="30"><td width="75" bgcolor="#FF00FF">Zelle1</td>
<td width="50" bgcolor="#00FFFF">Zelle2</td></tr>
<tr height="50"><td bgcolor="#FFFF00">Zelle3</td>
<td bgcolor="#00FF00">Zelle4</td></tr>
</table>
So siehts aus:
| Zelle1 | Zelle2 |
| Zelle3 | Zelle4 |
Kommentare
Es wurden noch keine Kommentare abgegeben!
Kommentar abgeben
Um ein Kommentar zu schreiben musst du eingeloggt sein.
