figcaption

Element figcaption reprezentuje nagłówek pełniący rolę objaśnienia treści reprezentowanej przez zawartość elementu figure, do którego należy dany element figcaption.

• Progres VI - Korzeń sekcji typu "figure"

kategoria ogólna

brak

kontekst zewnętrzny

jako element dziecko elementu figure, którego elementem dzieckiem nie jest inny element figcaption

Przykładowy Kod HTML

<figure>
  <img src="owoc-01.png" alt="czereśnia dojrzała">
  <img src="owoc-02.png" alt="czereśnia niedojrzała">
  <figcaption>Zdjęcia czereśni</figcaption>
</figure>

Kontekstem zewnętrznym przykładowego elementu "figcaption" jest element "figure", dla którego wspomniany element "figcaption" jest jedynym elementem dzieckiem typu "figcaption", dlatego w tej sytuacji wspomniany kontekst zewnętrzny, czyli element "figure", jest prawidłowym kontekstem zewnętrznym dla elementu "figcaption".

kontekst wewnętrzny

zawartość opływająca

Przykładowy Kod HTML

<figure>
  <figcaption>
    <p>Przykładowe reguły CSS</p>
    <p>Kod w pierwszym elemencie "pre" określa czerwony kolor tła elementu "body"</p>
    <p>Kod w drugim elemencie "pre" określa niebieski kolor tła elementów "div"</p>
  </figcaption>

  <pre>
    body {
      background-color:red;
    }
  </pre>

  <pre>
    div {
      background-color:blue;
    }
  </pre>
</figure>

Kontekstem wewnętrznym przykładowego elementu "figcaption" są wyłącznie elementy HTML, które należą do kategorii zawartość opływająca, dlatego w tej sytuacji wspomniany kontekst wewnętrzny, czyli element "p", element "p" oraz element "p", jest prawidłowym kontekstem wewnętrznym dla elementu "figcaption".

wymagane elementy dzieci

brak

wymagane atrybuty

brak

zdolność fallback

nie dotyczy

składnia HTML

<figcaption> ... </figcaption>

pominięcie tagu na początku

nigdy

pominięcie tagu na końcu

nigdy

CSS display

• block (jeżeli przeglądarka internetowa interpretuje element figcaption)

• inline (jeżeli przeglądarka internetowa nie interpretuje elementu figcaption)

/* jeżeli przeglądarka internetowa interpretuje element "figcaption" */
figcaption {
  display:block;
}

tak

tak

tak

tak

tak, lecz od wersji 9

tak

Zobacz więcej informacji o interpretacji elementu figcaption.