Comment utiliser les sélecteurs CSS pour cibler des éléments div contenant des attributs ou des balises spécifiques ?
P粉493313067
P粉493313067 2024-04-03 22:25:59
0
1
433

J'utilise un système de point de vente qui génère un site Web. La plupart du code est propriétaire, je ne peux donc pas modifier grand-chose.

J'ai une liste de sorties de catégories avec quelques images flottantes en tant que catégories. Je souhaite masquer les 3 premiers répertoriés sur la page d'accueil. J'ai essayé de positionner le div contenant en utilisant div:nth-child(1), qui fonctionne, mais chaque page enfant les cache également.

Malheureusement, toutes les pages autres que d'accueil n'ont qu'une classe ajoutée dans le corps et la div principale, je ne peux donc pas le faire par ID de catégorie, par style ou par page.

Ce que j'ai, c'est la même balise d'image sur chaque page. J'ai donc essayé ce qui suit :

img[src="theimage.png"] {
display: none; 
}

Cela fonctionne très bien aussi, mais cela ne fait que cacher l'image. Existe-t-il un moyen de positionner le div environnant en utilisant ce code ou une variante de ce code ? Voici une structure de base pour référence :

<div class="cCategoryDivContainer col-xs-12 col-sm-6 col-md-6 col-lg-4">
     <div class="cCategoryDiv">
         <div class="cItemTitleDiv">
             <p class="cCategoryTitle">Category Title</p>
         </div>
         <div class="cItemImageDiv">
             <span class="cItemImageHelper"></span>
             <a href="#"><img class="cItemImage" src="theimage.png"></a>
         </div>
     </div>
 </div>

Essentiellement, je souhaite cibler la classe cCategoryDivContainer et définir le src de l'image à l'intérieur du div IF sur theimage.png .

Est-ce possible ?

P粉493313067
P粉493313067

répondre à tous(1)
P粉011912640

Vous pouvez réellement le faire dans les navigateurs modernes. Consultez l'assistance : https://caniuse.com/?search=has

.cCategoryDiv:has(img[src="theimage.png"]) {
  display: none;
}

Category Title

Category Title

Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal