soy Kseso y esto EsCSS

Revert: la nueva palabra clave como valor para revertir la cascada 9.9.15

La nueva palabra clave (css keyword) revert y su significado y las novedades en la regla @import introducidas en el nuevo documento del w3c "CSS Cascading and Inheritance Level 4"

Revert: la nueva palabra clave como valor para revertir la cascada

Allá por Enero de 2013, actualizado en Octubre del mismo año, traía al blog las novedades del documento de nivel 3 CSS Cascading and Inheritance.

En concreto me centraba en dar a conocer la nueva propiedad all y las 3 CSS-wide keywords (palabras claves universales) posibles para un mejor control de la cascada y herencia Css: initial, inherit y unset.

Tras alcanzar este documento el status de CR W3C Candidate Recommendation ha visto la luz el nuevo desarrollo o nivel 4 el 8 de Septiembre.

Dos son las novedades significativas presentes en el nuevo documento CSS Cascading and Inheritance Level 4:

Revert como nueva palabra clave universal.
supports() como condicional en la regla @import

Palabras clave para la herencia y cascada

Como te decía, tres eran las palabras clave (keywords) disponibles hasta la fecha para controlar el valor de cualquier propiedad aplicado a un elemento bien por herencia o cascada:

initial: resetea la propiedad: Cada propiedad tiene un valor inicial, definido en la tabla que define la propiedad. Si el valor en cascada es la palabra clave initial, ese valor primero en la tabla de la propiedad se convierte en su valor especificado.
Tiene un significado distinto según se trate de propiedades heredadas o no heredadas.
En las heredadas el valor initial sólo aplica al elemento raíz (al que se le declara el valor) y en las no heredadas a todos los elementos: declarado y descendientes.
inherit: herencia explícita: En aquellas propiedades que admiten ser heredadas de padres a hijos, es el valor que se aplica al hijo para dicha propiedad si no la tiene declara, excepto que se vea afectado por la cascada.
Unset: Borrado de las declaraciones: Este valor tiene un doble significado. En aquellas propiedades cuyo valor sí se hereda equivale al valor inherit y en las propiedades que no se hereda su valor equivale a initial.

Revert: revertir la cascada

De la nueva keyword revert dice la especificación que su significado depende del origen (cascada) de la propiedad. Recuerda que pueden ser tres:

Declaraciones del agente de usuario (navegador).
Declaraciones en los estilos del usuario.
Declaraciones en los estilos del autor.

Por lo tanto, el valor final de revert es el siguiente según dónde se encuentre declarada la propiedad que por la cascada le afecta:

Origen en el agente de usuario:: Equivale a unset
Origen en el usuario:: Deshace la cascada y toma el valor que tenga declarado en el agente de usuario. Esto es, ignora los valores que provengan del usuario.
Origen en el autor: Ignora la cascada con origen en el autor (si la hubiera) y toma la proveniente de las declaraciones del usuario. Es como si el autor no hubiese declarado dicha propiedad.

El condicional supports() en la regla @import()

La inclusión de hojas de estilos en un documento se puede realizar, como es de sobra conocido, usando la regla @import(nombre.css).

Hasta ahora sólo se podía condicionar su inclusión según el media type al que estuviesen destinados los estilos en ella incluidos o mediante el uso de media queries:


@import url("fineprint.css") print;
@import url("bluish.css") projection, tv;
@import url("narrow.css") handheld and (max-width: 400px);

La novedad es que ahora se podrán incluir estilos en función del soporte o no a determinada propiedad y valor, tal como la regla @suport (){}, y que este condicional (suport) admita paréntesis enlazados:


@import url("fallback-layout.css") supports(not (display: flex));
@supports (display: flex) {
  ...
}

Pero recuerda que el uso de @import entraña ciertos riesgos.

Kseso

the obCSServer ᛯ Ramajero Argonauta, Enredique Amanuense de CSS.
#impoCSSible inside
Dicen que, en español, EsCss es el mejor blog de CSS. Posíblemente exageren.