Effet de survol CSS personnalisé dans les catégories

Soutien
1

Comment puis-je ajouter un style personnalisé pour a:hover ??? J’ai changé l’arrière-plan, mais je ne sais pas comment structurer le code pour ajouter un a:hover.

J’ai essayé ceci, mais cela ne fonctionne pas :

[data-category-id=“7”] {
.category-box { background: #0088CC10; }
a:hover { color: #D52133 !important; }
}

Pour l’arrière-plan, j’utilise ceci :

.category-box[data-category-id="1"] { background: #0088CC10; }
.category-box[data-category-id="7"] { background: #231F2010; }
.category-box[data-category-id="8"] { background: #12a89d10; }
.category-box[data-category-id="5"] { background: #bf1e2e10; }
.category-box[data-category-id="9"] { background: #25AAE210; }
.category-box[data-category-id="6"] { background: #F7941D10; }
.category-box[data-category-id="10"] { background: #B3B5B410; }
.category-box[data-category-id="2"] { background: #80828110; }
.category-box[data-category-id="3"] { background: #E4573510; }
.category-box[data-category-id="4"] { background: #A461EF10; }

image
image1082×624 47.6 KB

1 « J'aime »
2

Je ne sais pas à quoi ressemble votre HTML. Pouvez-vous fournir un lien vers votre page de catégorie ?

1 « J'aime »
3

https://alertamaximo.com/categories

1 « J'aime »
4

Exemple pour la catégorie 1 :

.category-box[data-category-id="1"] {
    background: #0088CC10;
    .badge-wrapper.bullet:hover span.badge-category {
      color: red;
    }
  }
}
6 « J'aime »
5

Cela a fonctionné parfaitement, merci beaucoup.

2 « J'aime »
6

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.