# Komórka tabeli HTML

Oprócz wierszy każda tabela HTML zbudowana jest z komórek. Każdy wiersz tabeli HTML może posiadać swoje komórki. Każda komórka tabeli HTML reprezentowana jest między innymi przez jeden element td. Zawartość każdej komórki tabeli HTML może reprezentować interesującą nas treść, na przykład interesujący nas ciąg znaków.

Przykład:

```html
<table>
  <tr>
    <td>czereśnia</td><!-- pierwsza komórka pierwszego wiersza -->
  </tr>
</table>
```

Rezultat:

<figure><img src="https://3945955358-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FR42GcKXoxIh1R4ROdsLU%2Fuploads%2FpJK6HxcNcjrSTKWxRidW%2Fimage.png?alt=media&#x26;token=a40c7ced-f88c-4200-944a-0a7f88ef81ef" alt=""><figcaption></figcaption></figure>

Oczywiście, jeżeli zechcemy, nasz przykładowy wiersz tabeli HTML może składać się z większej liczby komórek, czyli z większej liczby elementów `td`.

Przykład:

```html
<table>
  <tr>
    <td>czereśnia</td><!-- pierwsza komórka pierwszego wiersza -->
    <td>seler</td><!-- druga komórka pierwszego wiersza -->
    <td>sosna</td><!-- trzecia komórka pierwszego wiersza -->
    <td>róża</td><!-- czwarta komórka pierwszego wiersza -->
  </tr>
</table>
```

Rezultat:

<figure><img src="https://3945955358-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FR42GcKXoxIh1R4ROdsLU%2Fuploads%2FCDghdqdqNQFetL49Ho5C%2Fimage.png?alt=media&#x26;token=f717405a-496a-49b9-93b4-0e017f30a476" alt=""><figcaption></figcaption></figure>

Jeżeli zechcemy, aby nasza tabela HTML oraz jej poszczególne komórki posiadały domyślne obramowanie, wtedy możemy skorzystać z atrybutu border, który należy dodać do elementu `table`.

Przykład:

```html
<table border>
  <tr>
    <td>czereśnia</td>
    <td>seler</td>
    <td>sosna</td>
    <td>róża</td>
  </tr>
</table>
```

Rezultat:

<figure><img src="https://3945955358-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FR42GcKXoxIh1R4ROdsLU%2Fuploads%2Fo3dTbdc3kueGIYCiDvtQ%2Fimage.png?alt=media&#x26;token=b1e00146-465b-4a71-8aa1-1ba9a70c3530" alt=""><figcaption></figcaption></figure>

Tabela HTML może składać się z większej liczby wierszy, czyli z większej liczby elementów `tr`, które dodatkowo mogą posiadać swoje komórki, czyli elementy `td`, lecz każdy wiersz tej samej tabeli HTML powinien posiadać taką samą liczbę komórek, dzięki czemu unikniemy dodatkowych problemów.

Przykład:

```html
<table border>
  <tr>
    <td>czereśnia</td><!-- pierwsza komórka pierwszego wiersza -->
    <td>seler</td><!-- druga komórka pierwszego wiersza -->
    <td>sosna</td><!-- trzecia komórka pierwszego wiersza -->
    <td>róża</td><!-- czwarta komórka pierwszego wiersza -->
  </tr>

  <tr>
    <td>jabłko</td><!-- pierwsza komórka drugiego wiersza -->
    <td>marchew</td><!-- druga komórka drugiego wiersza -->
    <td>dąb</td><!-- trzecia komórka drugiego wiersza -->
    <td>tulipan</td><!-- czwarta komórka drugiego wiersza -->
  </tr>

  <tr>
    <td>gruszka</td><!-- pierwsza komórka trzeciego wiersza -->
    <td>rzodkiewka</td><!-- druga komórka trzeciego wiersza -->
    <td>świerk</td><!-- trzecia komórka trzeciego wiersza -->
    <td>słonecznik</td><!-- czwarta komórka trzeciego wiersza -->
  </tr>
</table>
```

Rezultat:

<figure><img src="https://3945955358-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FR42GcKXoxIh1R4ROdsLU%2Fuploads%2F2B1l6V6OVH1UDqXnNvu8%2Fimage.png?alt=media&#x26;token=13048d7e-1391-4d73-a43f-b47ea8ed9d08" alt=""><figcaption></figcaption></figure>

Od tej pory nasza przykładowa tabela HTML składa się z trzech wierszy (elementów `tr`) oraz z dwunastu komórek (elementów `td`). Ponadto każdy wiersz (element `tr`) naszej przykładowej tabeli HTML składa się z czterech komórek (elementów `td`).
