Question

嘿所以我正在制作tumblr主题，并且由于一些奇怪的原因，灰度效果有时只会在博客上的一些随机元素上添加填充，包括图像。这是因为过滤器是没有意义的，但当我关闭过滤器时，不会发生这样的事情。我尝试了很多不同的方法，我将在下面列出一些：

.gray {

 -webkit-filter: grayscale(.7);
-webkit-transition: all 1s ease-in-out;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;}
.gray:hover{

-webkit-filter: grayscale(0);
-webkit-transition: all 1s ease-in-out;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
}

----------------------------------------

    #content img {
 -webkit-filter: grayscale(.7);
-webkit-transition: all 1s ease-in-out;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;}

#content:hover img{
-webkit-filter: grayscale(0);
-webkit-transition: all 1s ease-in-out;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
}

----------------------------------------

#content:hover img{
-webkit-filter: none;
-webkit-transition: all 1s ease-in-out;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
}
.gray {

 -webkit-filter: grayscale(.7);
-webkit-transition: all 1s ease-in-out;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;}

由于冗余，我不会继续前进，但你明白了！所以我在内容ID中有图像，我试图让它们变成黑白，并且在悬停转动正常时，我做了，但由于某种原因，它有时会在悬停时添加填充。任何关于为什么会发生这种情况的线索，或者我在做灰度的方式有什么不妥之处？

Answer 1

我用我使用的代码制作了一个小提琴，它没有问题

似乎有些样式会覆盖:hover。尝试添加padding:0。

Answer 2

将以下内容添加到IE

的css代码中

.fmcircle_in span {filter: alpha(opacity=0);}

.fmcircle_out:hover .fmcircle_in span{filter: alpha(opacity=100);}

-webkit-filter：grayscale（）导致我在悬停css上出现问题

2 个答案: