reglas css anidadas

Question

Hace algún tiempo vi un ejemplo de un archivo css, donde las reglas/selectores css estaban especificadas de forma anidada, p. algo como esto:

div.a { 
    color: red; 
    div.b { 
    font-weight: bold; 
    } 
} 

No estoy seguro de donde vi que (probablemente en una pregunta SO), o si fue exactamente como se ha mostrado anteriormente.

Mis preguntas: ¿Es correcto el CSS anterior/válido? ¿Es una forma estándar de especificar reglas CSS o es un hack dependiente del navegador?

Answer 1

Puede reglas nido con SASS, http://sass-lang.com/

Tal vez eso era?

Answer 2

No es un CSS estándar válido, pero es un ejemplo de declaraciones de clase de anidación usando Sass/SCSS o LESS y creo que hay otras extensiones CSS que expanden a algo como esto (que es CSS válido) antes de servirlo el navegador de empleo:

div.a { 
    color: red; 
} 

div.a div.b { 
    /* Inherits color from div.a */ 
    font-weight: bold; 
} 

Answer 3

lo que es probable que esté refiriendo es LESS.

El ejemplo que proporcionó no es válido, pero es válido con MENOS. LESS "compilará" el CSS anidado y lo convertirá en algo que sea CSS válido.

Answer 4

parece que hay una propuesta encima en https://tabatkins.github.io/specs/css-nesting/

pero no puedo encontrar el estado de la misma