Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
menu search
person
Welcome To Ask or Share your Answers For Others

Categories

I have the following unique attribute assigned to a class:

.subcategory1:hover span { background: url(entertainment-hover.png); }

I have many such subcategory classes and I want to assign them additionally general attributes for :hover span and I came up with the following:

[class*="subcategory"]:hover span {
  background-size: 20px; 
  background-repeat: no-repeat;
  background-position: 0px 2px;

But it doesn't work and I cant find the problem!

Does anyone know what I have to amend to make this work assigning these attributes to all subcategory classes on :hover for span?

Please note that I dont have access to the HTML Code!

EDIT

[class*=subcategory]:hover span{
  background-repeat: no-repeat !important;
    background-size: 20px !important; 
  }
  
  
.subcategory1:hover span{ 
  background: url(https://designmodo.com/wp-content/uploads/2015/03/designmodo-icon.png) !important;
}
<div class="subcategory1">
    <span style="font-size: 100px;">I am in a mess</span>
  </div>
See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
356 views
Welcome To Ask or Share your Answers For Others

1 Answer

You can add another class to the current classes that you want to add an effect on hovering it for example

.hover-effect:hover span {
/*
your CSS code
*/
}
<div class="subcategory1 hover-effect">
<span>text</span>
</div>
<div class="subcategory2 hover-effect">
<span>text</span>
</div>
<div class="subcategory3 hover-effect">
<span>text</span>
</div>
<div class="subcategory4 hover-effect">
<span>text</span>
</div>

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
...