
El elemento html details se utiliza para mostrar información adicional al usuario que puede mostrar y ocultar cuando lo desee. Se puede colocar cualquier tipo de contenido dentro del elemento <details>
, y su contenido está oculto de forma predeterminada (a menos que se establezca la propiedad open
).
Ejemplo de uso de elemento <details>
con elemento <summary>
, tenga en cuenta que la propiedad open
hará que el navegador muestre el contenido al cargar la página:
< details > < summary > un detalle </ summary > < p > Información adicional sobre el primer detalle </ p > </ details > < details open > < summary > otro detalle </ summary > < p > Información adicional sobre el segundo resumen </ p > </ details >
Etiqueta html details
Clasificaciones de contenido | Un elemento organizativo, un elemento divisional y un elemento interactivo. |
---|---|
Contenido permitido | Un solo elemento <summary> seguido de contenido normal. |
Acrónimo | Las etiquetas de inicio o finalización no se pueden omitir. |
Elementos del padre | Cualquier elemento que acepte contenido normativo. |
Interfaz DOMO | HTMLDetailsElement |
Soporte de navegadores
Chrome | Firefox | Edge | Safari | Ópera |
---|---|---|---|---|
12 | 49 | Soportado | 6 | 15 |
Características
En este elemento details se pueden utilizar propiedades globales.
open
Valor booleano que indica si los detalles serán visibles para el usuario inmediatamente después de que se cargue la página, el valor predeterminado es false
que el contenido está inicialmente oculto.
Formato predeterminado
La mayoría de los navegadores muestran el elemento <details>
con la propiedad establecida display
en block
:
details { display: block; }
- Introducción al Lenguaje de Programación HTML
- Elemento HTML
- Elemento base en HTML
- Elemento head en HTML
- Elemento link en HTML
- Elemento meta en HTML
- Elemento style en HTML
- Elemento title en HTML
- Elemento body en HTML
- Elemento address en HTML
- Elemento article en HTML
- Elemento aside en HTML
- Elemento footer en HTML
- Elementos h1 al h6 en HTML
- Elemento header en HTML
- Elemento section en HTML
- Elemento blockquote en HTML
- Elemento nav en HTML
- Elemento dd en HTML
- Elemento div en HTML
- Elemento dl en HTML
- Elemento dt en HTML
- Elemento figcaption en HTML
- Elemento figure en HTML
- Elemento hr en HTML
- Elemento li en HTML
- Elemento main en HTML
- Resumen General de Listas en HTML
- Elemento ol en HTML
- Elemento p en HTML
- Descripción de las Etiquetas HTML
- Qué son los Atributos HTML
- Elemento ul en HTML
- Elemento a en HTML
- Elemento pre en HTML
- El Texto en HTML
- Elemento abbr en HTML
- Elemento b en HTML
- Elemento bdi en HTML
- Elemento bdo en HTML
- Elemento br en HTML
- Elemento cite en HTML