CSS pas de sélecteur ne fonctionne pas
Mon code HTML est généré par wordpress.
<div class="header-main">
<h1 class="site-title"><a href="http://wp-themes.com/" rel="home">Theme Preview</a></h1>
<div class="search-toggle active">
<a href="#search-container" class="screen-reader-text">Search</a>
</div>
<nav id="primary-navigation" class="site-navigation primary-navigation" role="navigation">
<h1 class="menu-toggle">Primary Menu</h1>
<a class="screen-reader-text skip-link" href="#content">Skip to content</a>
<div class="nav-menu"><ul><li class="page_item page-item-2"><a href="http://wp-themes.com/?page_id=2">About</a></li><li class="page_item page-item-46 page_item_has_children"><a href="http://wp-themes.com/?page_id=46">Parent Page</a><ul class="children"><li class="page_item page-item-49"><a href="http://wp-themes.com/?page_id=49">Sub-page</a></li></ul></li></ul></div>
</nav>
</div>
Je veux cacher tous les éléments mais avec .page-item-2
donc j'utilise:
.header-main .nav-menu li:not(.page-item-2) {
display:none;
}
Cela fonctionne, mais je veux aussi exclure .page-item-46
du sélecteur:
.header-main .nav-menu li:not(.page-item-2) :not(.page-item-46) {
display:none;
}
Qui ne fonctionne pas bien.
OriginalL'auteur greg hampton | 2014-03-12
Vous devez vous connecter pour publier un commentaire.
L'élément
.page-item-46
n'est pas un descendant, de sorte que vous pouvez supprimer l'espace entre la:not
pseudo-classes:EXEMPLE
Pour une autre, plus fondamentale exemple, considérez les points suivants:
À l'aide de la suite d'exclure les
.one
/.two
à partir de la sélection: (exemple)Le suivant ne fonctionne pas: (exemple)
Ni fait ceci: (exemple)
Cela ne fonctionne pas, soit parce qu'il est essentiellement sélectionne tous les éléments parce que les deux sélecteurs sont pas mutuellement exclusives. (exemple)
Si vous utilisez jQuery et que vous vous demandez pourquoi
:not(.one,.two)
ne fonctionne pas ici, voir stackoverflow.com/questions/10711730/...cela a fonctionné. Merci.
OriginalL'auteur Josh Crozier
Si vous avez votre réponse, juste dire que vous pouvez aussi faire comme ceci si vous vous souciez de navigateurs plus anciens:
OriginalL'auteur Mr_Green
utiliser cette CSS
OriginalL'auteur Harshit Tailor