Tabela je bistvena komponenta v HTML za prikaz podatkov v strukturirani obliki z vrsticami in stolpci. V HTML so tabele ustvarjene z oznakami <table>, <tr> in <td>.
Oznaka <table> predstavlja glavni vsebnik tabele, ki vsebuje vse vrstice in stolpce. Vrstice so definirane z oznako <tr>(vrstica tabele), celice znotraj vrstic pa z oznako <td>(podatki tabele). Poleg tega lahko uporabite oznako <th>(glava tabele), da določite celice glave za tabelo.
Atribute, kot sta colspan in rowspan, lahko uporabite za spajanje celic v tabeli ali razpenjanje celic v več vrsticah in stolpcih. Poleg tega lahko uporabite lastnosti CSS, da prilagodite videz in postavitev tabele.
Tabela( <table>)
- <table> Element se uporablja za ustvarjanje tabele v HTML.
- Podatki so postavljeni v vrstice( <tr>) in stolpce( <td> ali <th>).
- Vsaka podatkovna celica je postavljena znotraj elementov <td>(podatkovna celica) ali <th>(glavna celica).
<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>
Glava stolpca( <th>)
- <th> Element se uporablja za ustvarjanje naslovov stolpcev v tabeli.
- Običajno v prvi vrstici tabele.
<table>
<tr>
<th>No.</th>
<th>Name</th>
<th>Age</th>
</tr>
<!-- data rows -->
</table>
Podatkovne vrstice( <tr>):
- <tr> Element se uporablja za ustvarjanje podatkovnih vrstic v tabeli.
- Podatkovne celice( <td>) ali celice glave( <th>) so postavljene znotraj teh <tr> elementov.
<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>
Razpon stolpca( colspan)
Atribut colspan se uporablja za določanje števila stolpcev, ki jih bo zajemala podatkovna celica ali celica glave v tabeli.
<table>
<tr>
<th colspan="2">Personal Information</th>
</tr>
<tr>
<td colspan="2">John Doe</td>
</tr>
</table>
Razpon vrstic( rowspan)
Atribut rowspan se uporablja za določanje števila vrstic, ki jih bo zajemala podatkovna celica ali celica glave v tabeli.
<table>
<tr>
<th rowspan="2">No.</th>
<td>1</td>
<td>John</td>
</tr>
<tr>
<td>2</td>
<td>Jane</td>
</tr>
</table>
Spajanje celic( colspan in rowspan)
Kombinirate lahko oba atributa colspan in rowspan za spajanje celic v tabeli.
<table>
<tr>
<th rowspan="2">No.</th>
<th colspan="2">Personal Information</th>
</tr>
<tr>
<td>John</td>
<td>25</td>
</tr>
</table>
border premoženje
- border Lastnost določa debelino roba tabele.
- Vrednost border je nenegativno celo število.
<table border="1">
<!-- Table rows and columns -->
</table>
cellpadding premoženje
- ,The cellpadding property specifies the distance between the cell content and the border of the cell in the table.
- The value of cellpadding is a non-negative integer
<table cellpadding="5">
<!-- Table rows and columns -->
</table>
cellspacing property
- The cellspacing property specifies the spacing between cells in the table.
- The value of cellspacing is a non-negative integer.
<table cellspacing="10">
<!-- Table rows and columns -->
</table>
These attributes and elements allow you to create and customize tables in HTML according to your needs. You can use them to display data in a clear and organized manner on your website.