Ejemplo
Utilizando el <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>
Inténtalo tú mismo " Definición y Uso
Las <details> etiqueta especifica detalles adicionales que el usuario pueda ver u ocultar bajo demanda.
Los <details> etiqueta se puede utilizar para crear un widget de interactiva que el usuario puede abrir y cerrar. Cualquier tipo de contenido se puede poner dentro de la <details> etiqueta.
El contenido de un <details> elemento no debe ser visible a menos que el open se establece atributo.
Soporte para el navegador
Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con el elemento.
| Elemento | |||||
|---|---|---|---|---|---|
| <details> | 12.0 | No soportado | 48.0 | 6.0 | 15.0 |
Diferencias entre HTML 4.01 y HTML5
La <details> etiqueta es nueva en HTML5.
Notas y sugerencias
Consejo: La <summary> etiqueta se utiliza para especificar un encabezado visible para los detalles.El título se puede hacer clic para ver / ocultar los detalles.
atributos
= Nuevo en HTML5.
| Atributo | Valor | Descripción |
|---|---|---|
| open | open | Especifica que los datos deben ser visibles (abierta) para el usuario |
Los atributos globales
La <details> etiqueta también es compatible con el de los atributos globales en HTML .
Atributos de eventos
La <details> etiqueta también es compatible con la atributos de eventos en HTML .
Páginas relacionadas
Referencia HTML DOM: Details Objeto
Ajustes por defecto CSS
La mayoría de los navegadores mostrarán los <details> elemento con los siguientes valores predeterminados:
details {
display: block;
}