HTML Tabele
Tabele u HTML-u
HTML tabele su definirane <table> tagom.
Redovi tabele se definišu <tr> tagom.
Kolone tabele se definišu <td> i <th> tagovima.
<th> predstavlja naslovnu ćeliju, a <td> predstavlja podatkovne ćelije.
HTML tabela primjer
U nastavku je prikazano kako to izgleda u HTML-u:
<table border="1">
   <tr>
     <th> Ime </th>
     <th> Prezime </th>
     <th> Telefon </th>
   </tr>
   <tr>
     <td> John </td>
     <td> Clarke </td>
     <td> 067 777 777 </td>
   </tr>
   <tr>
     <td> Michael </td>
     <td> Gold </td>
     <td> 067 777 777 </td>
   </tr>
</table>
Ime | Prezime | Telefon |
---|---|---|
John | Clarke | 067 777 777 |
Michael | Gold | 067 888 888 |
colspan i rowspan
colspan atribut omogućava protezanje ćelije kroz više kolona.
rowspan atribut omogućava protezanje ćelije kroz više redova.
Ovako to izgleda u HTML-u:
<table border="1">
   <tr>
     <th colspan="2"> Ime i prezime </th>
     <th> Telefon </th>
   </tr>
   <tr>
     <td> John </td>
     <td rowspan="2"> Clarke </td>
     <td> 067 777 777 </td>
   </tr>
   <tr>
     <td> Michael </td>
     <td> 067 777 777 </td>
   </tr>
</table>
Ime i prezime | Telefon | |
---|---|---|
John | Clarke | 067 777 777 |
Michael | 067 888 888 |
Vidimo da se Ime i prezime proteže kroz 2 kolone, a zajedničko prezime Clarke kroz 2 reda.
<caption>
<caption> tag se koristi za dodavanje naslova tabele.
Naslov tabele se može dodati na početku ili na kraju.
U primjeru ispod se vidi kako se dodaje naslov za prethodnu tabelu:
<table border="2">
<caption> Ovo je naslov tabele <caption>
   <tr>
     <th> Ime </th>
     <th> Prezime </th>
     <th> Telefon </th>
   </tr>
   <tr>
     <td> John </td>
     <td> Clarke </td>
     <td> 067 777 777 </td>
   </tr>
   <tr>
     <td> Michael </td>
     <td> Gold </td>
     <td> 067 777 777 </td>
   </tr>
</table>
Ime | Prezime | Telefon |
---|---|---|
John | Clarke | 067 777 777 |
Michael | Gold | 067 888 888 |