¿Qué son las reglas CSS?

En CSS tenemos las denominadas «at-rules» (reglas precedidas del carácter @). Son un tipo de declaración especial que permite indicar comportamientos especiales en muchos contextos. Su sintaxis suele determinarse incluyendo una palabra clave que comienza por @ (como por ejemplo @media o @import) y dependiendo de la regla en cuestión, puede tener una sintaxis u otra:

Algunos ejemplos con @media o @import:

/* Regla @import para importar estilos CSS de otro fichero */
@import url("index.css");

/* Media query para definir estilos de móvil */
@media screen and (max-width: 640px) {
  .page {
    width: 100%;
  }
}

En general, se pueden colocar en cualquier parte de la hoja de estilos, tanto al principio, al medio como al final. Sin embargo, algunas reglas tienen ciertas restricciones. Por ejemplo, como comentaremos, en el caso de la regla @import debe colocarse en las primeras líneas del fichero.

Veamos a continuación que reglas CSS existen.

Reglas CSS

A continuación, podemos encontrar las siguientes reglas de CSS. Cada una pertenece a temáticas diferentes, en cada enlace profundizamos un poco sobre ellas:

Cada una de ellas, la explicaremos en su sección específica.

Reglas de @font-feature-values

Las reglas que vemos a continuación, son reglas CSS especiales que sólo sirven dentro de la regla @font-feature-values mencionada anteriormente, para indicar la activación/desactivación de características especiales en tipografías concretas.

Entre ellas, podemos encontrar las siguientes reglas: