Utilisation de CSS: pas de sélecteur dans les règles imbriquées LESS

.outerclass {
    h3 {
        color: blue;
    }
    p:not(.nested) {
        color: green;
    }
}

Au MOINS l'exemple ci-dessus, je souhaite cible de tous les "p" éléments à l'intérieur d'une div de classe "outerclass", mais PAS la p éléments au sein de la plus imbriquée div appelé ".imbriquée" - il ne fonctionne pas mais tous les éléments p vert. J'ai essayé...

p:not(.nested p) //excludes all p elements

et aussi...

p:not(.nested > p) //excludes all p elements

...en vain. Est-ce possible ou ce qui me manque? Je suis tout nouveau à MOINS

source d'informationauteur user2317093

  1. 24

    Il n'est pas MOINS un problème autant que votre sélecteur css la syntaxe. Le p:not(.nested) est à dire tous les p éléments sans l' .nested classe eux-mêmesce que vous dites, c'est que le .nested classe est sur un div dans lequel le p réside, si vous avez besoin de ceci:

    .outerclass {
    h3 {
        color: blue;
    }
    :not(.nested) p,
    > p {
        color: green;
    }
}

    Mise à JOUR: j'ai enlevé le div et a ajouté l'enfant direct p instance, de sorte que le CSS de sortie pour bien cibler tous les p dans .outerclass sauf pour l'exception.

    CSS de Sortie pour p éléments seraient

    .outerclass :not(.nested) p,
.outerclass > p {
  color: green;
}

    Au-dessus de la cible directe de l'enfant p éléments et toutes les p éléments dans .outerclass à l'exception de ceux qui sont les enfants de votre .nested élément.

    Un problème

    La question BoltClock est à noter est que si le p est imbriqué plus profond que l'enfant immédiat de la .nested élément. Voir ce violon, où le dernier p élément est toujours ciblée, même si elle est dans un .imbriquée de la classe.

    Si le p élément sera toujours l'enfant direct de .nested il n'y a pas de problème. Ou si le .nested est toujours l'enfant direct de .outerclass mais la p peut-être imbriqués plus profond, puis au-dessus du sélecteur peut être modifié à > :not(.nested) p pour produire CSS de .outerclass > :not(.nested) p qui ensuite le travail pour tous les p dans .imbriquée.

    Le problème sera si le .nested par rapport à .outerclass et la p dans .nested sont à la fois à une certaine profondeur arbitraire de ces parents. Pas de sélecteur css pourrait traiter de manière adéquate.