Concatenación de selectores en LESS
A veces necesitamos que al compilar estructuras anidadas, estas se concatenen de forma continua en lugar de con un espacio. Para ello, es necesario colocar un ampersand antes del nombre del selector anidado:
div {
&.block {
width: 300px;
}
}
Como resultado, después de la compilación obtendremos el siguiente código:
div.block {
width: 300px;
}
Explica cuál será el resultado de la compilación del siguiente código:
#block {
&.xxx {
width: 300px;
}
}
Explica cuál será el resultado de la compilación del siguiente código:
#block {
.xxx {
width: 300px;
}
}
Explica cuál será el resultado de la compilación del siguiente código:
#block {
&.xxx {
&.zzz {
width: 300px;
}
}
}
Explica cuál será el resultado de la compilación del siguiente código:
#block {
&.xxx {
.zzz {
width: 300px;
}
}
}
Explica cuál será el resultado de la compilación del siguiente código:
#block {
.xxx {
&.zzz {
width: 300px;
}
}
}
