Regla-At

Una regla-at es una declaración CSS que comienza con el símbolo arroba, '@' (U+0040 COMMERCIAL AT), seguido por un identificador, e incluye todo el contenido hasta el siguiente punto y coma, ';' (U+003B SEMICOLON), o el siguiente bloque CSS, lo que sea primero.

Hay varias reglas-at, designadas por sus identificadores, cada una con sintaxis distinta:

  • @charset — Define el conjunto de caracteres usado por la hoja de estilos.

  • @import — Indica al motor de CSS que incluya una hoja de estilos externa.

  • @namespace — Indica al motor de CSS que todo el contenido usa como prefijo un espacio de nombres XML.

  • Reglas-at anidadas — Un subconjunto de declaraciones anidadas, que pueden ser usadas como declaraciones de estilos, así como grupos de reglas condicionadas internas:

    • @media — Un grupo de reglas condicional que aplicará su contenido si el dispositivo cumple los criterios de las condiciones definidas usando un media query.
    • @supports — Un grupo de reglas condicional que aplicará su contenido si el navegador cumple los criterios de la condición dada.
    • @document — Un grupo de reglas condicionadas que aplicará su contenido si el documento donde se aplica la hoja de estilos cumple los criterios de la condición dada. (diferida al Nivel 4 de la Especificación CSS)
    • @page — Describe los cambios en la disposición de la página que serán aplicados al imprimir el documento.
    • @font-face — Describe la configuración de fuentes externas que se descargarán.
    • @keyframes — Describe la configuración de pasos intermedios en una secuencia de animación CSS.
    • @counter-style — Define estilos de contador específicos que no son parte de los conjuntos de estilos predeterminados. (en estado de Recomendación Candidata, pero sólo implementada en Gekko al momento de esta publicación)
    • @font-feature-values (junto con @swash, @ornaments, @annotation, @stylistic, @styleset y @character-variant) — Define nombres comunes para la propiedad font-variant-alternates. (en estado de Recomendación Candidata, pero sólo implementada en Gekko al momento de esta publicación)

Grupos de Reglas Condicionales

Así como los valores de las propiedades, cada regla-at tiene sintaxis propia. Sin embargo, muchas de esas reglas pueden ser agrupadas en categorías especiales, llamadas conditional group rules. Estas declaraciones comparten sintáxis común y cada una puede incluir nested statements—ya sean conjuntos de reglas o reglas-at anidadas. Además, pueden transmitir un significado semántico común—todas incluyen algun tipo de condición, que devuelve un resultado que puede ser verdadero o falso. Si el valor de la condición resulta verdadero, todas las declaraciones del grupo serán aplicadas.

Los grupos de reglas condicionales están definidos en CSS Conditionals Level 3 y son:

Como cada grupo de condición puede incluir también declaraciones anidadas, puede haber un número de anidaciones ilimitado.

Especificaciones

Specification
CSS Conditional Rules Module Level 3

Véase también