Plantilla de página de selectores CSS

Nota: Elimine toda esta nota explicativa antes de publicar

Metadatos de la página:

Los campos en la parte superior de la página se utiliza para definir "metadatos de página". Los valores deben actualizarse adecuadamente para el selector en particular.

md
---
title: :NameOfTheSelector
slug: Web/CSS/:NameOfTheSelector
page-type: css-selector Ó css-pseudo-class Ó css-pseudo-element Ó css-combinator
status:
  - experimental
  - deprecated
  - no-estandar
browser-compat: css.selectors.NameOfTheSelector
---
title

Título que se muestra en la parte superior de la página. Formatear como :NameOfTheSelector. Por ejemplo, el selector :hover tiene el título de :hover.

slug

El final de la ruta de la URL después de https://developer.mozilla.org/es/docs/). Se formateará como Web/CSS/:NameOfTheSelector. Por ejemplo, el slug del selector :hover es Web/CSS/:hover.

page-type

El valor de page-type para las propiedades CSS puede ser css-selector, css-pseudo-class o css-pseudo-element, dependiendo de si el selector es un pseudo-clase, un pseudo-elemento, un combinador (en-US), o un selector básico (en-US).

status

Incluye claves de estado de tecnología (apropiadas): experimental, obsoleto, no estándar (si no está en una pista de estándares).

browser-compat

Reemplace el valor del marcador de posición css.selectors.NameOfTheSelector con la cadena de consulta para el selector en el repositorio de datos de compatibilidad con los navegadores. La cadena de herramientas utiliza automáticamente la clave para rellenar las secciones de compatibilidad con los navegadores y especificaciones (reemplazando las macros {{Compat}} y {{Specifications}} en esas secciones, respectivamente).

Tenga en cuenta que es posible que primero necesite crear/actualizar una entrada para el selector y su especificación en nuestro repositorio de datos compatibilidad con los navegadores. Consulta nuestra guía sobre cómo hacerlo.

Macros al principio de la página

Varias llamadas de macro aparecen en la parte superior de la sección de contenido (inmediatamente debajo de los metadatos). Debes actualizarlos o eliminarlos de acuerdo con los siguientes consejos:

  • {{SeeCompatTable}} — esto genera un banner de tecnología experimental que indica que la tecnología es experimental. Si la tecnología que está documentando no es experimental, puede eliminarla. Si es experimental y la tecnología está oculta detrás de alguna preferencia en Firefox, también debes completar una entrada para ello en la página Funciones experimentales en Firefox.
  • {{Deprecated_Header}} — esto genera un banner de Desaprobado que indica que el uso de la tecnología está desaprobada. Si no lo es, puede eliminar la llamada de macro.
  • {{CSSRef}} — esto debe estar presente en cada página del selector de CSS. Genera una barra lateral CSS adecuada, dependiendo de qué etiquetas se incluyan en la página. Recuerde eliminar la macro {{MDNSidebar}} cuando copie esta página.

Sección de sintaxis ({{CSSSyntax}})

El contenido de la sección Sintaxis se genera utilizando la macro {{CSSSyntax}}. Para que estos se rellenen, debe asegurarse de que se haya completado una entrada adecuada para el selector en nuestro archivo de datos selectors.json. Consulta selectors.md para obtener más información.

Recuerde 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.

El párrafo de resumen: comience nombrando el selector y diciendo lo que hace. Idealmente, esto debería consistir en 1 o 2 oraciones cortas.

css
/* Insertar bloque de código que muestre casos de uso comunes */

Sintaxis

{{CSSSyntax}}

Para usar esta macro, elimine las comillas invertidas y la barra invertida en el archivo de markdown.

Ejemplos

Tenga 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 está haciendo 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, use el párrafo después del encabezado.

Consulta nuestra guía sobre cómo añadir ejemplos de código para obtener más información.

Nota: A veces, querrás vincular a ejemplos dados en otra página.

Escenario 1: Si tiene algunos ejemplos en esta página y algunos ejemplos más en otra página:

Incluya 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 puede vincular los ejemplos en otras páginas. Por ejemplo:

md
## 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 página:

No añada ningún encabezado H3; solo añada los enlaces directamente debajo del encabezado H2 "Ejemplos". Por ejemplo:

md
## Ejemplos

Para ver ejemplos de esta API, consulte [la página en fetch()](https://example.org).

Problemas de accesibilidad

Opcionalmente, advierte sobre cualquier posible problema de accesibilidad con el uso de este selector y cómo solucionarlo. Elimine esta sección si no hay una lista.

Especificaciones

{{Specifications}}

Para usar esta macro, elimine las comillas invertidas y la barra invertida en el archivo de markdown.

Compatibilidad con los navegadores

{{Compat}}

Para usar esta macro, elimine las comillas invertidas y la barra invertida en el archivo de markdown.

Veáse también

Incluya enlaces a páginas de referencia y guías relacionadas con el selector actual. Para obtener más pautas, consulta la sección Véase también en la Guía de estilo.

  • enlace1
  • enlace2