我想知道，我的网站上有很多图片，这些图片的表现取决于班级。我想知道是否有可能使用CSS来做到这一点。
.willReactOnHover.class1{ background: url('../images/image1.png');}
.willReactOnHover.class2{ background: url('../images/image2.png');}
然后，悬停
.willReactOnHover:hover{
background: /*Here, .class1 would be .image1-hover.png AND
.class2 would be .image2-hover.png */
}
我不知道是否有可能在所有现有路径上都添加后缀-hover，即使有所不同...我知道我可以使用javascript，但我会喜欢纯CSS解决方案，否则我将不得不创建悬停每个类的事件，但由于每个类的任务相同，因此我不知道是否有最佳方法。或者，也许有一个CSS选择器可以用来实现这一目标？
在CSS-3之前，人们经常将其background-position与图片精灵一起使用，因此您可以使用老式的背景位置，如下所示：
.willReactOnHover.class1{ background: url('../images/image1.png');}
.willReactOnHover.class2{ background: url('../images/image2.png');}
.willReactOnHover:hover{
background-position:-10px;
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句