2013-06-19 17 views
5

Il tag figure mostra una barra verticale 2D che visualizza determinati valori per le vendite. il tag figcaption visualizza l'etichetta "Vendite".Quale tag html5 dovrei usare all'interno di un tag figure

Quale tag html5 per i div all'interno della figura dovrei usare?

<figure> 
     <div class="push-center roundedArea" style="background-color:#fff;height:22%;"></div> 
     <div class="push-center diagram" style="background-color:#ff99cc;height:11%;">3</div> 
     <div class="push-center diagram" style="background-color:#ff33cc;height:44%;">44</div> 
     <div class="push-center diagram" style="background-color:#ff66cc;height:23%;">36</div> 
    </figure> 
<figcaption> 
    Sales 
</figcaption> 
+0

L'articolo [W3C Wiki 'figure'] (http://www.w3.org/wiki/HTML/Elements/figure) spiega alcuni degli usi semantici di esso, che sono vari. La [specifica 'figure'] (http://www.w3.org/TR/html5/grouping-content.html#the-figure-element) dice che dovrebbe contenere" contenuto di flusso "con un elemento' figcaption' opzionale prima o dopo il contenuto del flusso. Il contenuto del flusso è praticamente qualsiasi cosa su [questo elenco] (http://www.w3.org/TR/html5/dom.html#flow-content-1). TL; DR: Puoi mettere un sacco di cose lì dentro, ma assicurati che abbia un senso semantico. Inoltre, gli elementi 'div' sono ammessi all'interno degli elementi' figure'. – ajp15243

+0

sì, ho visto div-tag è tra i tag di contenuto del flusso, grazie :) Mettilo in una soluzione? – HelloWorld

+0

Inserito come risposta :) – ajp15243

risposta

5

Il W3C Wiki figure article spiega alcuni degli usi semantiche di esso, che sono varie. Il figure spec dice che dovrebbe contenere "contenuto di flusso" con un elemento figcaption opzionale prima o dopo il contenuto del flusso. Il contenuto del flusso è praticamente qualsiasi cosa su this list.

TL; DR: Puoi mettere un sacco di cose lì dentro, ma assicurati che abbia un senso semantico.

Inoltre, gli elementi div sono consentiti all'interno degli elementi figure (consultare l'elenco nel link sopra).

+0

Nonostante la vostra risposta sia corretta, mi sono reso conto che uso la figcaption in modo sbagliato. w3c dice che la figura contiene una figcaption ma la mia figpption è al di fuori della figura. Hm ... è abbastanza stupido. Non posso cambiare che potrebbe causare problemi di visualizzazione tecnica ... – HelloWorld

+0

@HelloWorld Ho visto che hai messo 'figcaption' al di fuori della 'figura'. Si noti che 'figure' non ha bisogno di un' figcaption'. Ho dato un'occhiata alla [specificazione di '' figcaption'] (http://www.w3.org/TR/html5/grouping-content.html#the-figcaption-element), e dice che rappresenta il "contenuto della figcaption" elemento figura genitore dell'elemento, * se presente * "(sottolineatura mia). La parte "se qualsiasi" implica che un 'figcaption' è permesso al di fuori di un elemento' figure', ma che in questo caso potrebbe non avere molto significato. Quindi è tecnicamente corretto, ma forse non semanticamente corretto per averlo al di fuori di 'figure'. – ajp15243

+0

ahh bene quando uso la figura e ho un'etichetta con un significato per ogni elemento all'interno della figura Voglio usare una figcaption e io nk sottile che è corretto in realtà anche un must credo di essere al 100% semanticamente corretto :) – HelloWorld