<div>: The Content Division element

L'elemento HTML Content Division (<div>) è un contenitore generico per contenuti di flusso. Non ha alcun effetto sui contenuti fin quando non viene stilizzato attraverso CSS. In quanto contenitore "puro", l'elemento <div> di suo non rappresenta nulla. E' utilizzato piuttosto per raggruppare contenuti in modo da essere facilmente stilizzato attraverso gli attributi class o id, o per contrassegnare una sezione di un documento scritta in una lingua diversa (utilizzando l'attributo lang), e così via.

Attributi

Questo elemento include gli attributi globali.

L'attributoalign è obsoleto; non utilizzarlo. Piuttosto, bisognerebbe utilizzare le proprietà o tecniche CSS quali CSS Grid o CSS Flexbox per allineare e posizionare gli elementi <div> all'interno della pagina.

Note sull'utilizzo

• L'elemento <div> dovrebbe essere utilizzato esclusivamente quando altri elementi semantici, (quali as <article> o <nav>) non sono più appropriati.

Esempi

Un semplice esempio

<div>
  <p>Qualsiasi contenuto, come
  &lt;p&gt;, &lt;table&gt;. Decidi tu!</p>
</div> 

Il risultato apparirà così:

Un esempio stilizzato

Questo esempio crea un box dotato d'ombra, applicando uno stile al <div> usando CSS. Notare l'utilizzo dell'attributo class sul<div> per applicare lo stile chiamato "shadowbox" sull'elemento.

HTML

<div class="shadowbox">
  <p>Qui troviamo una nota molto interessante 
  in un box dotato di un'amorevole ombra.</p>
</div>

CSS

.shadowbox {
  width: 15em;
  border: 1px solid #333;
  box-shadow: 8px 8px 5px #444;
  padding: 8px 12px;
  background-image: linear-gradient(180deg, #fff, #ddd 40%, #ccc);
}

Risultato

Specificazioni

Compatibilità dei browser

Vedi anche

• Elementi di sezione semantici: <section>, <article>, <nav>, <header>, <footer>
• <span> per la stilizzazione di contenuti di enunciazione.