Después de que realizamos la encuesta anterior para ayudar a elegir la sintaxis del período de prueba de CSS, el grupo de trabajo de CSS continuó analizando la mejor manera de definir el anidado en CSS. Durante los debates, se sugirieron nuevas ideas de sintaxis. Para ayudar al grupo de trabajo a elegir entre cualquiera de estas sintaxis, existe una nueva encuesta.
Las opciones
Según los resultados de la encuesta anterior, ya no se consideran las opciones uno y dos. Se agregaron dos opciones nuevas (cuatro y cinco).
Opción 5: Contenedor de anidamiento de nivel superior
Introduce 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 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 es una letra
Cada regla anidada debe ser inequívoca por sí sola, ya que debe comenzar con un elemento que no sea un 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 inscripción. Elige “Opción 5”, “Opción 4” o bien “Opción 3” y presiona Enviar.