Esempio
Utilizzando la <details> elemento:
<details>
<summary>Copyright 1999-2014.</summary>
<p> - by Refsnes Data. All Rights Reserved.</p>
<p>All content and graphics on this web site are the property of the company Refsnes Data.</p>
</details>
Prova tu stesso " Definizione e utilizzo
I <details> tag specifica ulteriori dettagli che l'utente può visualizzare o nascondere su richiesta.
I <details> tag possono essere utilizzati per creare un widget interattivo che l'utente può aprire e chiudere. Qualsiasi tipo di contenuti può essere messo all'interno del <details> tag.
Il contenuto di un <details> elemento non deve essere visibile a meno che il open attributo è impostato.
Supporto per il browser
I numeri nella tabella indicano la prima versione del browser che supporta pienamente l'elemento.
Elemento | |||||
---|---|---|---|---|---|
<details> | 12.0 | Non supportato | 48.0 | 6.0 | 15.0 |
Differenze tra HTML 4.01 e HTML5
Il <details> tag è nuovo in HTML5.
Suggerimenti e Note
Suggerimento: il <summary> tag viene utilizzato per specificare un titolo visibile per i dettagli.Il titolo può essere cliccato per visualizzare / nascondere i dettagli.
attributi
= Nuovo in HTML5.
Attributo | Valore | Descrizione |
---|---|---|
open | open | Specifica che i dati dovrebbero essere visibili (aperto) per l'utente |
attributi globali
Il <details> tag supporta anche l' Attributi globali in HTML .
Attributi eventi
Il <details> tag supporta anche l' evento Attributi in HTML .
Pagine correlate
Di riferimento DOM HTML: Details oggetto
Impostazioni predefinite CSS
La maggior parte dei browser visualizzare i <details> elemento con i seguenti valori di default:
details {
display: block;
}