web-dev-qa-db-fra.com

CSS "et" sélecteur - Puis-je sélectionner des éléments ayant plusieurs classes?

J'essaie de sélectionner tous les éléments qui ont les deux .checked et .featured Mots clés. Donc, fondamentalement, ce que je recherche, c’est un sélecteur "et"; Je ne sais pas s'il y en a un ou pas.

Existe-t-il une solution de contournement pour des cas comme celui-ci?

60
Mia

Vous utilisez les deux ( sans espace entre eux )

.checked.featured{
   // ...
}

Référence: http://www.w3.org/TR/selectors/#class-html


Exemple

div{margin:1em;padding:1em;}

.checked{color:green;}
.featured{border:1px solid #ddd;}

.checked.featured{
       font-weight:bold;
    }
<div class="checked">element with checked class</div>
<div class="featured">element with featured class</div>
<div class="featured checked">element with both checked and featured classes</div>
101
Gabriele Petrioli

Vous pouvez simplement "rejoindre" deux classes comme ça: .checked.featured

15
Moseleyi

Pour exprimer ET vous concaténez simplement vos cours .checked.featured qui ne doit pas être confondu avec le populaire .checked .featured qui est le sélecteur de descendant.

Regardez le fonctionnaire Documentation

9
Christoph