HTML Tutorial #18 - Tabele

[Vampire Andy 229]

Tagul <table> este folosit pentru a deschide un tabel. Înăuntrul acestui tag vom găsi alte două taguri <tr> (liniile tabelului) şi <td> (coloanele tabelului). Exemplu :

 

<table border="1">

<tr><td>Row 1 Cell 1</td><td>Row 1 Cell 2</td></tr> <tr><td>Row 2 Cell 1</td><td>Row 2 Cell 2</td></tr>

</table>

Vizualizare

 

 

Conţinutul va fi plasat în interiorul căsuţelor tabelului. O casuţă este ceea ce se află între <td> şi </td>. Atributul border stabileşte lăţimea marginii tabelului.

 

HTML - Tabele asimetrice

 

Pentru a forma tabele asimetrice vom folosi "rowspan" pentru a traversa mai mute linii şi "colspan" pentru a traversa mai multe coloane. Deasemenea dacă vrem ca prima linie să aibe titlu pentru toate coloanele vom folosi tagul <th>. Exemplu :

 

<table border="1"> 
<tr>
<th>Column 1</th> 
<th>Column 2</th>
<th>Column 3</th>
</tr>
<tr><td rowspan="2">Row 1 Cell 1</td> 
<td>Row 1 Cell 2</td><td>Row 1 Cell 3</td></tr>
<tr><td>Row 2 Cell 2</td><td>Row 2 Cell 3</td></tr> 
<tr><td colspan="3">Row 3 Cell 1</td></tr>
</table>

Vizualizare

 

 

HTML - Spaţierea celulelor

 

Cu ajutorul atributelor "cellpadding" şi "cellspacing" vom defini distanţa dintre celule. "cellspacing" stabileşte mărimea marginii, iar "cellpandding" stabileşte distanţa dintre margine şi conţinut.

 

<table border="1" cellspacing="10" 
bgcolor="rgb(0,255,0)"> 
<tr> 
<th>Column 1</th> <th>Column 2</th> 
</tr> 
<tr><td>Row 1 Cell 1</td><td>Row 1 Cell 2</td></tr> <tr><td>Row 2 Cell 1</td><td>Row 2 Cell 2</td></tr> 
</table>

Pentru a face mai bine diferenţa vom elimina marginea .

 

<table border="1" cellpadding="10"
bgcolor="rgb(0,255,0)">

<tr>

<th>Column 1</th>
<th>Column 2</th>

</tr>

<tr><td>Row 1 Cell 1</td><td>Row 1 Cell 2</td></tr> <tr><td>Row 2 Cell 1</td><td>Row 2 Cell 2</td></tr>

</table>

Distanţa între celule şi dimensiunea margini va fi interpretată de browser în pixeli. Conform acestei "legi" o valoare de 10 sunt de fapt 10 pixeli. Acest atribut nu este singurul care foloseşte ca unitate de măsură, pixeli .