Question

为了使IE 10和IE 11中的工作灰度工作，我可以做我在这个问题中找到的内容：internet explorer 10 - howto apply grayscale filter?，但这适用于单个图像。我需要为所有图像做这件事。我怎么能这样做？

//.bc contain all the images
.bc {
    filter: url("data:image/svg+xml;utf8,<svg%20xmlns='http://www.w3.org/2000/svg'><filter%20id='grayscale'><feColorMatrix%20type='matrix'%20values='0.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200%200%200%201%200'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(.9); /* Google Chrome, Safari 6+ & Opera 15+ */

    filter: grayscale(90%);

    transition : filter 500ms linear;
    -webkit-transition: -webkit-filter 500ms linear;
    -moz-transition: -moz-filter 500ms linear;
}

那么，我怎样才能使它适用于多个图像？如何使转换效果起作用（它仍然无法在Firefox中运行）？

Answer 1

您应该使用-moz-filter：

.bc {
    filter: grayscale(90%);
    -moz-filter: grayscale(90%);
    -webkit-filter: grayscale(90%);
}

Answer 2

你可以使用Lea Verou的Prefixfree查看here

.bc {
        filter: grayscale(90%);
    }

或使用标准

  .bc {
        -webkit-filter: grayscale(90%);
        -moz-filter: grayscale(90%);
        -ms-filter: grayscale(90%);
        filter: grayscale(90%);
    }

如何使firefox中的灰度和过渡效果工作，即？

2 个答案: