Aide pour choisir la syntaxe de l'imbrication CSS

Après avoir mené l'enquête précédente pour choisir la syntaxe de l'imbrication CSS, le groupe de travail CSS a continué à débattre sur la meilleure façon de définir l'imbrication dans CSS. Au cours des discussions, de nouvelles idées de syntaxe ont été proposées. Pour aider le groupe de travail à choisir entre l'une de ces syntaxes, il y a une nouvelle enquête.

Options

Sur la base des résultats de l'enquête précédente, les options 1 et 2 ne sont plus prises en compte. Deux nouvelles options ont été ajoutées (quatre et cinq).

Option 5: Conteneur d'imbrication de premier niveau

Introduit une règle @nest de niveau supérieur contenant un bloc & { … } avec des déclarations et plusieurs règles de style imbriquées.

@nest selector {
  & {
    property: value;
  }
  nested-selector {
    property: value;
  }
}

Option 4: Proposition Postfix

Un bloc de code supplémentaire contenant les règles imbriquées est inséré après la règle principale qui contient les déclarations.

selector {
  property: value;
} {
  nested-selector {
    property: value;
  }
}

Option 3: Proposition de démarrage autre qu'une lettre

Chaque règle imbriquée doit être elle-même sans ambiguïté, en l'obligeant à commencer par un non-symbole. Vous pouvez écrire & div ou :is(div) si vous devez démarrer un sélecteur avec un sélecteur de type.

selector {
  property: value;
  & nested-selector {
    property: value;
  }
}

Bien que les extraits ci-dessus ne soient utilisés que pour illustrer les bases de chaque proposition, il y a beaucoup d'autres exemples inclus avec le nouveau sondage.

Votez

Pour voter, rendez-vous sur https://webkit.org/blog/13607/. Le vote ne nécessite aucune inscription. Choisissez "Option 5", "Option 4" ou "Option 3", puis cliquez sur "Envoyer".

Votez !