Lekcje >> Podstawy HTML 5
Polimax

Drukarnia w Warszawie realizująca druk wizytówek, plakatów jak również fotoksiążki, fotoobrazy i fotokalendarze - z wysyłką na terenie całego kraju.

Elementy figure i figcaption

Znacznik Znacznik <figure>...</figure> grupuje elementy stanowiące logiczną całość, natomiast <figcaption>...</figcaption> jest podpisem. Najlepszym przykładem są rysunki - w każdym porządnym opracowaniu widzimy, że posiadają podpis np. Rysunek 1. Budowa eugleny zielonej i z tym podpisem stanowią integralną całość. Podobnie jest z tabelami, zestawieniami, wykresami itp.- najczęściej są to elementy, które w pracy występują wielokrotnie i można by otrzymać ich spis treści. <figure>...</figure>, jest znacznikiem mającym znaczenie semantyczne.
Kod, który spowoduje wyświetlenie obrazka,(o wstawianiu obrazków będziemy się uczyć) wraz z podpisem wygląda następująco:

<figure>
  <img src="euglena.jpg" alt="Budowa eugleny zielonej" />
  <figcaption>
    Rysunek 1. Budowa eugleny zielonej
  </figcaption>
</figure>

Ćwiczenie 2_1_7_1

Stosując kod pokazany wyżej oraz obrazek, wykonaj stronę opisującą budowę eugleny zielonej. Efekt Twojej pracy powinien wyglądać następująco:

Praca domowa

Wykonaj stronę na dowolny temat, w której zastosujesz elementy <figure>...</figure> oraz <figcaption>...</figcaption>. Strona powinna posiadać minimum dwa akapity tekstu.


Jeżeli nie jesteś pewny, jak wykonane zadania zapisać na pendriwie, to zajrzyj do pierwszego ćwiczenia, w którym zostało to dokładnie wytłumaczone.