Un tabel este o componentă esențială în HTML pentru afișarea datelor într-un format structurat cu rânduri și coloane. În HTML, tabelele sunt create folosind etichetele <table>, <tr> și <td>.
Eticheta <table> reprezintă containerul tabelului principal, care conține toate rândurile și coloanele. Rândurile sunt definite folosind eticheta <tr>(rând de tabel), în timp ce celulele din rânduri sunt definite folosind eticheta <td>(date de tabel). În plus, puteți utiliza eticheta <th>(antet tabel) pentru a defini celulele antet pentru tabel.
Puteți utiliza atribute precum colspan și rowspan pentru a îmbina celulele din tabel sau pentru a extinde celulele pe mai multe rânduri și coloane. În plus, puteți aplica proprietăți CSS pentru a personaliza aspectul și aspectul tabelului.
Tabel( <table>)
- <table> Elementul este folosit pentru a crea un tabel în HTML.
- Datele sunt plasate în rânduri( <tr>) și coloane( <td> sau <th>).
- Fiecare celulă de date este plasată în elemente <td>(celula de date) sau <th>(celula antet).
<table>
<tr>
<th>No.</th>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>1</td>
<td>John</td>
<td>25</td>
</tr>
<tr>
<td>2</td>
<td>Jane</td>
<td>30</td>
</tr>
</table>
Antetul coloanei( <th>)
- <th> Elementul este folosit pentru a crea anteturi de coloană într-un tabel.
- Plasat de obicei în primul rând al tabelului.
<table>
<tr>
<th>No.</th>
<th>Name</th>
<th>Age</th>
</tr>
<!-- data rows -->
</table>
Rânduri de date( <tr>):
- <tr> Elementul este folosit pentru a crea rânduri de date într-un tabel.
- Celulele de date( <td>) sau celulele antet( <th>) sunt plasate în aceste <tr> elemente.
<table>
<tr>
<th>No.</th>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>1</td>
<td>John</td>
<td>25</td>
</tr>
<tr>
<td>2</td>
<td>Jane</td>
<td>30</td>
</tr>
</table>
Întinderea coloanelor( colspan)
Atributul colspan este utilizat pentru a determina numărul de coloane pe care o celulă de date sau o celulă antet le va cuprinde în tabel.
<table>
<tr>
<th colspan="2">Personal Information</th>
</tr>
<tr>
<td colspan="2">John Doe</td>
</tr>
</table>
Întinderea rândurilor( rowspan)
Atributul rowspan este utilizat pentru a determina numărul de rânduri pe care o celulă de date sau o celulă antet le va cuprinde în tabel.
<table>
<tr>
<th rowspan="2">No.</th>
<td>1</td>
<td>John</td>
</tr>
<tr>
<td>2</td>
<td>Jane</td>
</tr>
</table>
Îmbinarea celulelor( colspan și rowspan)
Puteți combina ambele colspan și rowspan atributele pentru a îmbina celulele dintr-un tabel.
<table>
<tr>
<th rowspan="2">No.</th>
<th colspan="2">Personal Information</th>
</tr>
<tr>
<td>John</td>
<td>25</td>
</tr>
</table>
border proprietate
- border Proprietatea specifică grosimea chenarului tabelului.
- Valoarea lui border este un număr întreg nenegativ.
<table border="1">
<!-- Table rows and columns -->
</table>
cellpadding proprietate
-, cellpadding Proprietatea specifică distanța dintre conținutul celulei și chenarul celulei din tabel.
- Valoarea lui cellpadding este un număr întreg nenegativ
<table cellpadding="5">
<!-- Table rows and columns -->
</table>
cellspacing proprietate
- cellspacing Proprietatea specifică distanța dintre celule din tabel.
- Valoarea lui cellspacing este un număr întreg nenegativ.
<table cellspacing="10">
<!-- Table rows and columns -->
</table>
Aceste atribute și elemente vă permit să creați și să personalizați tabele în HTML în funcție de nevoile dvs. Le puteți folosi pentru a afișa datele într-un mod clar și organizat pe site-ul dvs.