Después de realizar la encuesta anterior para ayudar a elegir la sintaxis para el anidamiento de CSS, el Grupo de trabajo de CSS continuó el debate sobre la mejor manera de definir el anidamiento en CSS. Durante los debates, se sugirieron nuevas ideas de sintaxis. Para ayudar al Grupo de trabajo a elegir entre cualquiera de estas sintaxis, se creó una nueva encuesta.
Las opciones
Según los resultados de la encuesta anterior, las opciones uno y dos ya no se consideran. Se agregaron dos opciones nuevas (cuatro y cinco).
Opción 5: Contenedor de anidación de nivel superior
Presenta una regla @nest de nivel superior que contiene un bloque & { … } con declaraciones y varias reglas de estilo anidadas.
@nest selector {
& {
property: value;
}
nested-selector {
property: value;
}
}
Opción 4: propuesta de Postfix
Se inserta un bloque de código adicional que contiene las reglas anidadas después de la regla principal que contiene las declaraciones.
selector {
property: value;
} {
nested-selector {
property: value;
}
}
Opción 3: Propuesta de inicio que no sea una letra
Cada regla anidada debe ser inequívoca por sí sola, ya que requiere que comience con un no símbolo. Puedes escribir & div o :is(div) si necesitas iniciar un selector con un selector de tipo.
selector {
property: value;
& nested-selector {
property: value;
}
}
Si bien los fragmentos anteriores solo se utilizan para demostrar los conceptos básicos de cada propuesta, se incluyen muchos más ejemplos junto con la nueva encuesta.
Vota
Para emitir tu voto, visita https://webkit.org/blog/13607/. La votación no requiere registro. Elige "Opción 5", "Opción 4" u "Opción 3" y presiona "Enviar".