A táblázat a HTML elengedhetetlen összetevője az adatok strukturált formátumban, sorokkal és oszlopokkal történő megjelenítéséhez. A HTML-ben a táblázatok a <table>, <tr> és <td> címkék használatával jönnek létre.
A <table> címke a fő táblázattárolót jelöli, amely tartalmazza az összes sort és oszlopot. A sorokat a <tr>(táblasor) címkével, míg a sorokon belüli cellákat a <td>(táblaadatok) címkével határozzuk meg. Ezenkívül használhatja a <th>(táblafejléc) címkét a táblázat fejléccelláinak meghatározásához.
Használhat attribútumokat, például a colspan és a rowspan cellákat a táblázat celláinak egyesítésére, vagy cellákat több sorban és oszlopban. Ezenkívül CSS-tulajdonságokat is alkalmazhat a táblázat megjelenésének és elrendezésének testreszabásához.
táblázat( <table>)
- Az <table> elem HTML-beli táblázat létrehozására szolgál.
- Az adatok sorokba( <tr>) és oszlopokba( <td> vagy <th>) kerülnek.
- Minden adatcella <td>(adatcella) vagy <th>(fejléccella) elemekbe kerül.
<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>
Oszlopfejléc( <th>)
- Az <th> elem a táblázat oszlopfejléceinek létrehozására szolgál.
- Általában a táblázat első sorában helyezik el.
<table>
<tr>
<th>No.</th>
<th>Name</th>
<th>Age</th>
</tr>
<!-- data rows -->
</table>
Adatsorok( <tr>):
- Az <tr> elem adatsorok létrehozására szolgál egy táblázatban.
- Az adatcellák( <td>) vagy a fejléccellák( <th>) ezeken az elemeken belül helyezkednek el <tr>.
<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>
Oszlopfesztávolság( colspan)
Az colspan attribútum annak meghatározására szolgál, hogy egy adatcella vagy fejléccella hány oszlopot fog át a táblázatban.
<table>
<tr>
<th colspan="2">Personal Information</th>
</tr>
<tr>
<td colspan="2">John Doe</td>
</tr>
</table>
Sor feszítése( rowspan)
Az rowspan attribútum annak meghatározására szolgál, hogy egy adatcella vagy fejléccella hány sort fog átívelni a táblázatban.
<table>
<tr>
<th rowspan="2">No.</th>
<td>1</td>
<td>John</td>
</tr>
<tr>
<td>2</td>
<td>Jane</td>
</tr>
</table>
Cellák egyesítése( colspan és rowspan)
colspan A és az attribútumok kombinálásával egyesítheti rowspan a cellákat egy táblázatban.
<table>
<tr>
<th rowspan="2">No.</th>
<th colspan="2">Personal Information</th>
</tr>
<tr>
<td>John</td>
<td>25</td>
</tr>
</table>
border ingatlan
- A border tulajdonság a táblázat szegélyének vastagságát adja meg.
- Az értéke border egy nem negatív egész szám.
<table border="1">
<!-- Table rows and columns -->
</table>
cellpadding ingatlan
- ,A cellpadding tulajdonság megadja a távolságot a cellatartalom és a cella határa között a táblázatban.
- Az értéke cellpadding egy nem negatív egész szám
<table cellpadding="5">
<!-- Table rows and columns -->
</table>
cellspacing ingatlan
- A cellspacing tulajdonság a táblázat cellái közötti távolságot határozza meg.
- Az értéke cellspacing egy nem negatív egész szám.
<table cellspacing="10">
<!-- Table rows and columns -->
</table>
Ezek az attribútumok és elemek lehetővé teszik a táblázatok létrehozását és testreszabását HTML-ben az Ön igényei szerint. Használhatja őket az adatok átlátható és rendszerezett megjelenítésére a webhelyén.