Documente Academic
Documente Profesional
Documente Cultură
Lucrul Cu Tabele
Lucrul Cu Tabele
1. Crearea de tabele
Pentru a crea tabele in paginile web se foloseste elementul <table> ... </table> , acesta incadreaza alte
patru sub-elemente, care alcatuiesc structura tabelului.
Linia tabelului de obicei contine elementul pentru titlurile tabelului si elementul pentru coloanele tabelului.
In cadrul elementelor pentru titluri si coloanele tabelului se pot adauga si alte elemente HTML, cum ar fi cele
pentru formatul textului, paragrafe, link-uri sau imagini
Mai jos puteti vedea un exemplu de cod HTML pentru crearea unui tabel:
<table border="1">
< 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>
titlu 2
2. Atributele Tabelului
Sub-titlu tabelului
- Sub-titlu tabelului "caption" permite specificarea unei linii de text care va aparea deasupra sau sub tabel,
acest lucru este definit de atributul "align" care poate lua valorile: top (deasupra) bottom (jos)
Exemplu:
<table border="1" cellpadding="2">
<caption align="bottom">acesta este textul</caption>
< tr>
<th>titlu 1</th>
<th>titlu 2</th>
< /tr>
< tr>
<td>linia 2- coloana 1</td>
<td>linia 2- coloana 2</td>
< /tr>
< /table>
titlu 2
- colspan = specifica cat de multe coloane ale tabelului aceasta celula va inlocui
- rowspan = specifica cat de multe randuri ale tabelului aceasta celula va inlocui
- align = alinierea datelor celulei pe orizontala (left, right sau center)
- valign = alinierea datelor celulei pe verticala (top, middle sau bottom)
- background = controleaza culoarea de fond a celulei, care poate fi si o imagine
- bgcolor = defineste culoarea celulei (dar nu imagine)
- width = specifica lungimea celulei (In pixeli sau procente din lungimea paginii)
- height = specifica inaltimea celulei (In pixeli sau procente din inaltimea paginii)
in urmatorul exemplu puteti vedea rezultatul folosirii atributelor: "colspan" "rowspan" si "bgcolor"
<table border="1" 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>
- In pagina web apare asa:
titlu 1
titlu 2
linia 2- coloana 1
linia 3- coloana 1
linia 3- coloana 2
linia 4- coloana 2 - colorat
1. Crearea de tabele
2. ATRIBUTELE