Ho letto in alcuni punti che quando si usa la flexbox, si dovrebbe avere tutto il contenuto in a <header>, <main> e <footer> tag per flexbox per far funzionare la sua magia. È vero? Sono necessari questi tag?
risposte:
2 per risposta № 1No. Vedi il astratto delle specifiche:
La specifica descrive un modello di box CSSottimizzato per l'utente design dell'interfaccia. Nel modello di layout flessibile, i bambini di un flex il contenitore può essere disposto in qualsiasi direzione e può "flettersi" dimensioni, crescendo per riempire lo spazio inutilizzato o restringendolo per evitare traboccare il genitore. Allineamento orizzontale e verticale del i bambini possono essere facilmente manipolati. Nidificazione di queste scatole (orizzontale all'interno verticale, o verticale all'interno orizzontale) può essere utilizzato per costruire layout in due dimensioni.
CSS è un linguaggio per descrivere il rendering di documenti strutturati (come HTML e XML) su schermo, su carta, in parlato, ecc.
Flexbox è parte del CSS, che è un linguaggio indipendente dall'HTML. Quindi dire che richiede alcuni elementi HTML non ha senso.
Qui hai un esempio funzionante che non usa quegli elementi:
div { display: flex; }
span { border: 1px solid; }
span:nth-child(1) { flex-grow: 1; }
span:nth-child(2) { flex-grow: 2; }
span:nth-child(3) { flex-grow: 3; }<div>
<span>A</span>
<span>B</span>
<span>C</span>
</div>