2

kurs

html

Lekcja 14: Tabela

html

Konstrukcja tabeli

<table>
<tr>
<td>Komórka tabeli</td>
<td>Komórka tabeli</td>
</tr>
</table>
  • <table>
    - znacznik tabeli
  • <tr>
    - znacznik wiersza tabeli
  • <td>
    - znacznik komórki tabeli
Przykład
Komórka tabeli Komórka tabeli

Ostylowanie tabeli

W powyższym przykładzie tabela i jej zawartość jest mało wyrazista w związku z tym dodamy obramowanie (border) dla tabeli i komórek.

<table style="border: 1px solid red;">
<tr>
<td style="border: 1px solid red;">Komórka tabeli</td>
<td style="border: 1px solid red;">Komórka tabeli</td>
</tr>
</table>
Przykład
Komórka tabeli Komórka tabeli

Teraz dodamy tło (background) oraz zwiększymy odstępy (padding) od krawędzi komórek.

<table style="border: 1px solid red; background: grey; padding: 10px;">
<tr>
<td style="border: 1px solid red; background: silver; padding: 10px;">
Komórka tabeli</td>
<td style="border: 1px solid red; background: silver; padding: 10px;">
Komórka tabeli</td>
</tr>
</table>
Przykład
Komórka tabeli Komórka tabeli
comments powered by Disqus

Do góry