Tag-ul <table>

Despre tabele

Pentru a crea tabele în paginile web se folosește tagul <table> ... </table>, acesta delimitează tabelul, iar pentru a determina componentele lui se utilizează în cadrul lui alte patru sub-elemente.

Linia tabelului conține, de obicei, tagul pentru titlurile tabelului și tagul pentru coloanele tabelului.
De asemenea, în cadrul tagurilor se pot adăuga și alte taguri HTML, cum ar fi cele pentru formatul textului, paragrafe, link-uri sau imagini. Indicat pentru formatarea textului și a paragrafelor să se utilizeze coduri css.

EXEMPLU de cod pentru crearea unui tabel

<!doctype html5>
<html>
<head><title>Tabele</title></head>
<body>
<table border="3">
<tr> <th>titlu 1</th> <th>titlu 2</th> </tr>
<tr> <td>linia 2- coloana 1</td> <td>linia 2- coloana 2</td></tr>
<tr> <td>linia 3- coloana 1</td> <td>linia 3- coloana 2</td></tr>
<tr> <td>linia 4- coloana 1</td> <td>linia 4- coloana 2</td></tr>
</table>
</body>
</html>
Clik aici pt vizualizare exemplu

Atribute specifice elementelor pentru titlu și coloane

EXEMPLU de cod pentru crearea unui tabel

<!doctype html5>
<html>
<head><title>Tabele</title></head>
<body>
<table border="3" cellpadding="2">
<caption align="bottom">acesta este textul</caption>
<tr> <th>titlu 1</th> <th>titlu 2</th></tr>
<tr> <td colspan="2">linia 2- coloana 1</td></tr>
<tr><td rowspan="2">linia 3- coloana 1</td> <td>linia 3- coloana 2</td></tr>
<tr> <td bgcolor="#adadff">linia 4- coloana 2 - colorat</td></tr>
</table>
</body>
</html>
Clik aici pt vizualizare exemplu

Fișă de lucru

  1. Scrieți codurile HTML de mai sus într-o pagină web cu spaţiu între ele și rulaţi într-un browser.
  2. Modificaţi la alegere parametrii tagurilor utilizate.
  3. Creaţi următorul tabel într-o pagină web:
  4. Notele de la scoala
    Nume elev Nota romanaNota matematicaNota TICNota engleza
    Popescu78910
    Ionescu10987
    Albescu881010
  5. Modificaţi pagina web pentru hobby-ul preferat creat anterior, adăugând un tabel cu cel puţin două linii şi două coloane.
  6. Pentru tag-ul table scrieţi un comentariu explicativ.