Chrome中的混合模式没有正确应用

Question

正在努力朝着聚焦的重复背景，并决定使用混合模式来实现这一点。

但是，看起来好像混合模式不适用于Chrome。

这里复制：http://jsfiddle.net/pptn4f5v/7/

body { 
    background: url("https://dl.dropboxusercontent.com/u/10686242/testfreeimage.jpg"), url("https://dl.dropboxusercontent.com/u/10686242/background-blend%20-%20Copy.png") #030303; 
    background-repeat: repeat, no-repeat; 
    background-blend-mode: multiply, normal; 
    background-size: auto, contain; 
} 

这是Chrome浏览器的限制？这在Firefox中很适用。

Answer 1

也许这是浏览器的错误

但是，你可以更容易地获得这样的效果，它会工作确定在这两个浏览器

只能使用2背景，用梯度

创建点

.test { 
 
    background: url("https://dl.dropboxusercontent.com/u/10686242/testfreeimage.jpg"), 
 
      radial-gradient(circle at 250px 100px, transparent 50px, #606060 150px); 
 
    background-blend-mode: darken; 
 
    height: 400px; 
 
}

<div class="test"></div>