Chrome 中的 css 反转过滤器

I have

BODY
{
-webkit-filter: invert(100%);
-moz-filter: invert(100%);
-ms-filter: invert(100%);
-o-filter: invert(100%);
filter: invert(100%);
}

and

.jpg
{
-webkit-filter: invert(0%) !important;
-moz-filter: invert(0%) !important;
-ms-filter: invert(0%) !important;
-o-filter: invert(0%) !important;
filter: invert(0%) !important;
}

这在 MIE 中有效。 Chrome 坚持也反转 jpg 类的图片。

有什么建议么？

From 了解 CSS 滤镜效果 http://www.html5rocks.com/en/tutorials/filters/understanding-css/:

当浏览器加载网页时，它需要应用样式、执行布局，然后渲染页面，以便有东西可看。过滤器在所有这些步骤之后、页面复制到屏幕之前启动。他们所做的是将渲染页面的快照作为位图图像，然后对快照中的像素执行一些图形魔法，然后将结果绘制在原始页面图像的顶部。

您正在将过滤器应用于body，并且过滤器作为扁平图像应用于整个元素，而不是单独应用于每个子元素，因此您无法像您尝试那样覆盖子元素上的过滤器。

你什么can在你的情况下做的是适用invert(100%)到您想要显示为未反转的选择器，因为双反转图像再次变得正常。