Plantilla de página de elemento HTML
Nota: Elimina toda esta nota explicativa antes de publicar.
Front matter de la página:
El front matter al principio de la página se usa para definir los "metadatos de la página". Los valores deben actualizarse adecuadamente para el elemento en cuestión.
---
title: "<NombreDelElemento>: El elemento NombreDelElemento"
slug: Web/HTML/Reference/Elements/NombreDelElemento
page-type: html-element
status:
- deprecated
- experimental
- non-standard
browser-compat: html.elements.NombreDelElemento
sidebar: htmlsidebar
---
- title
-
Encabezado del título que se muestra en la parte superior de la página. Formato:
'<NombreDelElemento>: Descripción del propósito del elemento'. Por ejemplo, el elemento<video>tiene un title de: '<video>: El elemento de inserción de video'. - slug
-
El final de la ruta URL después de
https://developer.mozilla.org/es/docs/. Tendrá el formatoWeb/HTML/Reference/Elements/NombreDelElemento, donde el nombre del elemento está en minúsculas. Por ejemplo, el elemento<video>tiene un slug deWeb/HTML/Reference/Elements/video. - page-type
-
Siempre
html-element. - status
-
Indicadores que describen el estado de esta funcionalidad. Es un arreglo que puede contener uno o más de los siguientes valores:
experimental,deprecated,non-standard. Esta clave no debe configurarse manualmente: se establece automáticamente según los valores en los datos de compatibilidad de navegadores. Consulta "Cómo se añaden o actualizan los estados de las funcionalidades". - browser-compat
-
Reemplaza el valor de marcador de posición
html.elements.NombreDelElementocon la cadena de consulta para el elemento en el repositorio de datos de compatibilidad de navegadores. La cadena de herramientas usa automáticamente esta clave para rellenar las secciones de compatibilidad y especificaciones (reemplazando las macros{{Compat}}y{{Specifications}}). -
htmlsidebarpara todas las páginas de guía y referencia de HTML. Consulta Estructuras de página: barras laterales para más detalles.
Macros de la parte superior de la página
Varias macros aparecen en la parte superior de la sección de contenido inmediatamente después del front matter. Estas macros se añaden automáticamente mediante la cadena de herramientas (no es necesario añadirlas ni eliminarlas):
{{SeeCompatTable}}— genera un banner de Esta es una tecnología experimental que indica que la tecnología es experimental. Si es experimental y está oculta detrás de una preferencia en Firefox, también debes completar una entrada en la página Funcionalidades experimentales en Firefox.{{Deprecated_Header}}— genera un banner de Obsoleto que indica que el uso de la tecnología está desaconsejado.{{Non-standard_Header}}— genera un banner de No estándar que indica que la funcionalidad no forma parte de ninguna especificación.
Consulta "Cómo se añaden o actualizan los estados de las funcionalidades" para más información.
Justo después de este bloque de notas se muestran ejemplos de los banners Experimental, Obsoleto y No estándar.
Recuerda eliminar toda esta nota explicativa antes de publicar.
Experimental: Esta es una tecnología experimental
Comprueba la Tabla de compabilidad de navegadores cuidadosamente antes de usarla en producción.
Obsoleto: Esta característica ya no se recomienda. Aunque es posible que algunos navegadores aún lo admitan, probablemente ya se ha eliminado de los estándares web relevantes, está en proceso de eliminación o solo se conserva por motivos de compatibilidad. Evite usarlo y actualice el código existente si es posible; consulte la tabla de compatibilidad en la parte inferior de esta página para orientar su decisión. Tenga en cuenta que esta característica puede dejar de funcionar en cualquier momento.
No estándar: Esta función no está estandarizada. No recomendamos usar funciones no estándar en producción, ya que tienen un soporte limitado en los navegadores y pueden cambiar o eliminarse. Sin embargo, pueden ser una alternativa adecuada en casos específicos donde no exista una opción estándar.
El elemento HTML <insertar_el_nombre_del_elemento> hace (insertar un párrafo de resumen nombrando el elemento y diciendo qué hace, idealmente una o dos frases cortas).
Pruébalo
Esta sección es generada por la macro InteractiveExample. Incluye el título de la sección "Try it" y el editor de código. Consulta la sección de Ejemplos interactivos en nuestras Directrices de escritura para más información.
Más información — en este punto, incluye algunos párrafos más explicando las cosas más importantes que se deben saber sobre el uso del elemento y sus características principales. Es bueno explicar brevemente qué sucede en el ejemplo interactivo si no es obvio de inmediato. También podrías explicar puntos clave sobre cómo este elemento interactúa con características importantes relacionadas de JavaScript o CSS. No entres en demasiados detalles (no conviene repetir la documentación en varias páginas), pero un punto clave más un enlace a la página de esa característica sería útil. De nuevo, consulta la página de <video> para ver un ejemplo.
Atributos
Este elemento incluye los atributos globales.
Eventos
Incluye una tabla de los eventos que se disparan en este tipo de elemento, si los hay.
| Nombre del evento | Se dispara cuando |
|---|---|
| evento 1 | Explica brevemente cuándo se dispara |
| evento 2 | Explica brevemente cuándo se dispara |
| etc. |
Accesibilidad
Advierte sobre cualquier posible problema de accesibilidad que exista al usar este elemento y cómo solucionarlo. Elimina esta sección si no hay nada que enumerar.
Ejemplos
Ten en cuenta que usamos el plural "Ejemplos" incluso si la página solo contiene un ejemplo.
Un encabezado descriptivo
Cada ejemplo debe tener un encabezado H3 (###) que nombre el ejemplo. El encabezado debe ser descriptivo de lo que hace el ejemplo. Por ejemplo, "Un ejemplo simple" no dice nada sobre el ejemplo y, por lo tanto, no es un buen encabezado. El encabezado debe ser conciso. Para una descripción más larga, usa el párrafo después del encabezado.
Consulta nuestra guía sobre cómo añadir ejemplos de código para más información.
Nota: A veces querrás enlazar a ejemplos dados en otra página.
Escenario 1: Si tienes algunos ejemplos en esta página y algunos más en otra página:
Incluye un encabezado H3 (###) para cada ejemplo en esta página y luego un encabezado H3 final (###) con el texto "Más ejemplos", bajo el cual puedes enlazar a los ejemplos en otras páginas. Por ejemplo:
## Ejemplos
### Uso de la API fetch
Ejemplo de Fetch
### Más ejemplos
Enlaces a más ejemplos en otras páginas
Escenario 2: Si solo tienes ejemplos en otra página y ninguno en esta:
No añadas encabezados H3; simplemente añade los enlaces directamente bajo el encabezado H2 "Ejemplos". Por ejemplo:
## Ejemplos
Para ver ejemplos de esta API, consulta [la página sobre fetch()](https://example.org/).
Resumen técnico
| Categorías de contenido | Completa una lista de las categorías de contenido a las que pertenece el elemento HTML. |
|---|---|
| Contenido permitido | ¿Qué contenido se permite que contenga el elemento? |
| Omisión de etiqueta | ¿Se puede omitir la etiqueta de cierre o debe estar presente? ¿Debe omitirse? |
| Padres permitidos | ¿De qué elementos padre puede ser hijo este elemento? Por ejemplo, "Cualquier elemento que acepte contenido de flujo (flow content)." |
| Roles ARIA permitidos |
Completa una lista de los roles ARIA que se pueden establecer en el elemento; por ejemplo,
directory.
|
| Interfaz DOM |
¿Qué interfaz DOM representa al elemento en JavaScript? Por ejemplo,
HTMLOListElement en el caso de ol.
|
Especificaciones
{{Specifications}}
Para usar esta macro, elimina las comillas invertidas y la barra invertida en el archivo markdown.
Compatibilidad con navegadores
{{Compat}}
Para usar esta macro, elimina las comillas invertidas y la barra invertida en el archivo markdown.
Véase también
Incluye enlaces a páginas de referencia y guías relacionadas con el elemento actual. Para más pautas, consulta la sección Véase también en la Guía de estilo de escritura.
- enlace1
- enlace2
- enlace_externo (año)