只有部分图像的灰度？

Question

css中是否可以只制作图像的一部分灰度？ 我试过使用过滤器无济于事，似乎无法想到任何方法来实现这一点。你有什么想法吗？

我想让这张图片只在本页的黑暗部分显示为灰色。

Answer 1

我之前做过类似的事情......

1. 使用div并将其background-image设置为图片。
2. 设置background-position并绝对定位，使其看起来是相同的图像。
3. 使用CSS在div上设置灰度。

jsFiddle

对于你想要的确切事物，我可能会让它有一个黑色背景，其中opacity设置为必需，顶部插入阴影为顶部效果。