Comment puis-je cibler spécifiquement cette id de l'élément avec le CSS?

<div id=checkout>
<form id="confirmation" class="center">
<p>content</p>
</form>
</div>

J'ai un sélecteur CSS #checkout form.center déjà utilisé

je voudrais remplacer ce spécifiquement pour le formulaire de confirmation, mais aucune des choses que j'essaie d'écrire appliquée. Je pense que #confirmation form.center ou quelque chose doit remplacer la première règle, mais il ne semblent même pas à toucher la cible. #confirmation obtient remplacée par la mentionnés ci-dessus sélecteur parce que c'est pas aussi précis.

InformationsquelleAutor Damon | 2011-01-11
  1. 9

    Expansion sur BoltClock réponse:

    Chaque sélecteur CSS a un la spécificité valeur. Pour chaque élément, dans le cas d'un conflit pour la valeur de l'une de ses propriétés, la règle de la plus grande spécificité est prioritaire. En général, plus et mieux l'information dans un sélecteur CSS, la plus grande de sa spécificité.

    Pour cette raison, l'ajout de quelque chose d'approprié pour votre sélecteur existant (#checkout form.center) vous permettra de remplacer:

    #checkout form.center {
  /* your existing CSS */
}

#checkout #confirmation {
  /* your overrides; this has higher specificity */
}

#checkout form#confirmation {
  /* this would also work -- even higher specificity */
}

#checkout form#confirmation.center {
  /* even higher */
}

#checkout form.center p {
  /* works inside the p only, but also has
     greater specificity than #checkout form.center  */
}
    InformationsquelleAutor Jon
  2. 5

    Si vous avez besoin spécifiquement de remplacer votre sélecteur existant, utilisez:

    #checkout #confirmation

    La raison pour laquelle #confirmation form.center ne fonctionne pas, c'est parce qu'sélectionne form.center qui se trouve dans un #confirmation élément, qui n'est pas le même. Vous aurait-il écrit comme ceci à la place:

    #checkout form#confirmation.center

    mais c'est exagéré; le premier sélecteur je suggère, c'est assez précis pour remplacer votre premier sélecteur.

    InformationsquelleAutor BoltClock