투명 CSS3 그라디언트를 배경 이미지 위에 오버레이 할 수 있습니까?

Question

배경 이미지 위에 CSS3 그래디언트를 넣으려고합니다. 아래 코드를 사용하면 내 그라디언트 위에 배경 이미지를 넣을 수 있습니다.하지만 다른 방법으로이를 수행하려고하므로 그라디언트가 맨 위에 마스크로 사용됩니다. 당신의 도움에 대한

url(images/darkwood.png), 
-webkit-gradient(linear, 0 0, 0 100%, from(#EEF), to(#000)) 300px 50px no-repeat, 
-webkit-gradient(linear, 0 0, 0 100%, from(#EFE), to(#000)) 0 0 no-repeat; 
background: 
url(images/darkwood.png), 
-moz-linear-gradient(#EEF, rgba(0,0,0,1)) 300px 50px no-repeat, 
-moz-linear-gradient(#EFE, rgba(0,0,0,1)) 0 0 no-repeat; 

감사

Answer 1

나는 내 웹 사이트 중 하나에 이렇게 당신을 위해 일의 희망이;

body { 
    margin: 0; 
    padding: 0; 
    background: url('img/background.jpg') repeat; 
} 

body:before { 
    content: " "; 
    width: 100%; 
    height: 100%; 
    position: absolute; 
    z-index: -1; 
    top: 0; 
    left: 0; 
    background: -webkit-radial-gradient(top center, ellipse cover, rgba(255,255,255,0.2) 0%,rgba(0,0,0,0.5) 100%); 
} 

Answer 2

위 예제는 크기 조정 가능한 div로는 작동하지 않습니다.

코드가 정상적으로 작동합니다. 그러나 나는 그것을 이해하고 CSS는 오른쪽에서 왼쪽으로 읽습니다.

div { 
    background: -webkit-radial-gradient(top center, ellipse cover, rgba(255,255,255,0.2) 0%,rgba(0,0,0,0.5) 100%), url('http://www.google.co.uk/logos/classicplus.png') repeat; 
} 

예 : http://sapphion.com/2011/11/css3-background-gradient-on-top-of-an-image/