Elemente de figura și figcaption

În mass-media de imprimare convenționale, cum ar fi cărți și reviste, imagini, tabele și mostre de cod sunt, de obicei, însoțite de o semnătură. Până acum nu am fost în măsură să aloce acestui tip de conținut semantic direct HTML, mai degrabă decât a recurge la numele de clasă CSS. HTML5 speră să corecteze această problemă cu ajutorul unor elemente noi:

și
. Să vedem!

element

Se presupune că elementul

Acesta va fi utilizat împreună cu elementul
pentru a aloca diagrame, ilustrații, fotografii, și exemple de cod (printre altele). Asta se spune despre
în caietul de sarcini:

element

Este un fragment dintr-un conținut independent, nu neapărat cu semnătura, care se referă în general la elementul individual al conținutului principal al unui document, și poate fi îndepărtat din document, fără a compromite sensul.

element

Acest element a devenit o cauza de dispute serioase. Caietul de sarcini a fost propusă inițial pentru a se adapta la aceste elemente obiective . în loc de a veni cu un element nou. Au existat alte propuneri care au inclus

și chiar antete

-

. Elementul semantica schimbat. și așa am început să folosească o combinație de
și
în
la sugestia lui Jeremy. Dar cele mai multe dintre aceste idei au fost respinse din cauza lipsei de compatibilitate pentru CSS-design.

Cititorii noștri regulate știu că un nou element a fost introdus recent

. Cine știe dacă el va primi obișnuit, dar acum să aflăm ce se spune despre caietul de sarcini:

element

Reprezintă un titlu sau o descriere pentru
.

element

Este opțională și poate să apară înainte sau după conținutul interior
. Doar un singur element
Acesta poate fi plasat în
. deși elementul
poate cuprinde mai multe elemente copil (de exemplu, sau ).

utilizarea
și

Deci, am aflat că aceste elemente sunt discutate în caietul de sarcini. Cum le folosesc? Să ne uităm la un exemplu.

pentru imagine

Imaginea în elementul

nesemnate:

Elemente de figura și figcaption

Iată codul pentru că:

cu imagine și semnătura

Imaginea în interiorul elementului

cu o legendă explicativă:

Elemente de figura și figcaption
maimuță impudent Borneo. Foto Richarda Klarka

Și codul pe care am folosit:

cu mai multe imagini

Plasarea mai multor imagini într-o singură celulă

legendă generală:

Elemente de figura și figcaption
Elemente de figura și figcaption
Elemente de figura și figcaption
De la stânga la dreapta: Kucabara, Pelican și nucă de cocos Lorikeet. fotografii Richard Clarke

un bloc de cod

element

Acesta poate fi de asemenea utilizat pentru exemple de cod:

Utilizarea elementului în jurul valorii de o trimitere la o licență Creative Commons cu rel = „licență“.

Mai jos este codul pentru că:

diferențele dintre
și

Am vorbit deja despre elementul