Rozmiary tabel HTML
Tabele HTML mogą mieć różne rozmiary dla każdej kolumny, wiersza lub całej tabeli.
Użyj styleatrybutu z
właściwościami widthlub height
, aby określić rozmiar tabeli, wiersza lub kolumny.
Szerokość tabeli HTML
Aby ustawić szerokość tabeli, dodaj style
atrybut do <table>elementu:
Przykład
Ustaw szerokość stołu na 100%:
<table style="width:100%">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
Uwaga: Użycie wartości procentowej jako jednostki rozmiaru dla szerokości oznacza, jak szeroki będzie ten element w porównaniu z elementem nadrzędnym, którym w tym przypadku jest <body>
element.
Szerokość kolumny tabeli HTML
Aby ustawić rozmiar określonej kolumny, dodaj style
atrybut do elementu <th>lub
<td>:
Przykład
Ustaw szerokość pierwszej kolumny na 70%:
<table style="width:100%">
<tr>
<th style="width:70%">Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
Wysokość wiersza tabeli HTML
Aby ustawić wysokość określonego wiersza, dodaj style
atrybut do elementu wiersza tabeli:
Przykład
Ustaw wysokość drugiego rzędu na 200 pikseli:
<table style="width:100%">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr style="height:200px">
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>