CSS混合背景下面的元素

Question

有反正有一個子元素的背景與它下面的元素的顏色混合沒有使用mix-blend-mode這是不夠好的支持（閱讀：它不支持鉻）？

下面的圖片就是我在談論的一個最原始的例子：

Answer 1

隨着CSS

element{ 
    filter: grayscale(100%); 
    filter: url(#greyscale); 
    filter: gray; 
    -webkit-filter: grayscale(1); 
} 

可以使圖像黑色和白色。

我建議做的是創建你的背景，然後創建一個具有相同背景和上面顯示的CSS的div，因此它將是黑色和白色。
然後，您可以設置背景大小和背景位置屬性來移動您的div，並匹配下面的圖像。

它應該訣竅！

這是Fiddle。

Answer 2

看來是沒有辦法用純CSS但對於誰可能需要一個JavaScript的解決方案，我發現人可以做到這一點過濾孩子的background，設置background-size於母公司的並設置background-position到圖像偏離您想要過濾的背景的負數量。

JS Fiddle

這並不說明任何文字或一般多背景進行過濾。而mix-blend-mode似乎是唯一的想法等待。