HTML Tabellen-Grösse - Code

Wie kann ich eine Tabelle mit einer anderen Grösse erstellen?
Wie kann ich die Grösse der Spalten aufspalten?

Erklärung

Tabellen -Grösse


Wir können die Grösse der Tabelle in pixels und Prozentsat einstellen.Erstmal werden wir sehen wie man die Grösse in Pixels einstellt Die Attributen width und height werden verwendet werden.
Beispiel

Example Code


<table border=1 bgcolor="green" width=300 height=100>
<tr height=30>
<td>
This is 1st row 1st column
</td>
<td>
This is 1st row 2nd column
</td>
</tr>
<tr height=70>
<td>
This is 2nd row 1st column
</td>
<td background="./test.jpg">
This is 2nd row 2nd column <br><br> Nice background
</td>
</tr>
</table>

Jetzt werden wir die Breite der Tabelle als 300 and Höhe als 100 einstellen und spalten wir sie auf 30 für die erste Zeile und 70 für die zweite Zeile auf.
Ergebnis:
This is 1st row 1st column This is 1st row 2nd column
This is 2nd row 1st column This is 2nd row 2nd column
Nice background

Tabellen-Grösse in Prozentsatz


Die Breite und Höhe der Tabelle können durch Prozentsatz eingestellt werden.
z.B: width=60%.
Das bedeutet dass die Tabelle zu 60% des aktuellen Komponents gezeichnet wird.
d.h. wenn wir eine Tabelle innerhalb eines body Tags zeichnen mit der Breite von 100%, dann die Breite der Tabelle wird gleich mit der Breite des Browsers sein.
Eine Tabelle kann innerhalb von Tabellen gezeichnet werden. Wir werden das aber später sehen.
Beispiel

Example Code


<table border=1 bgcolor="green" width=80% height=20%>
<tr height=30%>
<td>
This is 1st row 1st column
</td>
<td>
This is 1st row 2nd column
</td>
</tr>
<tr height=70%>
<td>
This is 2nd row 1st column
</td>
<td background="./test.jpg">
This is 2nd row 2nd column <br><br> Nice background
</td>
</tr>
</table>

Jetzt werden wir die Gesamtbreite als 80% und Höhe als 30% einstellen und die Höhe zu 30% zu der ersten Zeile und 70% zu der zweiten Zeile aufspalten.
Um alles genauer zu erklären, sagen wir das die Komponentgrösse wie Breite=500,Höhe=500 so wird die Tabelle jetzt 80% von 500 (400) wie die Gesamtbreite und 30% von 500 (150) wie die Gesamthöhe. Dann wird es die 150 Höhe in 30% für die erste Zeile aufspalten und 70% für die zweite.
Ergebnis:

This is 1st row 1st column This is 1st row 2nd column
This is 2nd row 1st column This is 2nd row 2nd column
Nice background