어떻게 별도로

Question

내가 ExtJS로 함께 일하고 여러 배경 이미지에 투명도를 제공하고 아래와 같이 CSS (불투명도)를 적용하고 싶지만 당신의 대답은 그 CSS 할 수있는 '입니다

.class{ 
    background-image:url(../images/marion.png),url(../images/dots1.png),url(../images/dots2.png),url(../images/neur  al.png); 
    background-repeat: no-repeat,repeat-x,repeat-x,no-repeat; 
    background-position: center 22px,right center,right center,0 0 ; 
    background-size :42% 9%,20% 15%,20% 12%,100% 100% ; 
    opacity:0.3,0.2,0.2,0.8; /* this is not working */ 
} 

Answer 1

을 좀 도와 PLZ 작동하지 않을 수 있습니다 이러지 마. 그러나, 당신이 예제를 요구했기 때문에 나는 그것을 당신에게 줄 것입니다.

또 다시 이것이 당신에게 가치가 있는지 의심 스럽지만 모든 배경 이미지의 픽셀 좌표와 배경 이미지의 배경을 알고 있다면 본질적으로 그리는 매우 긴 상자 그림자 속성을 작성할 수 있습니다 불투명도의 환상을 만드는 데 필요한 영역에 컬러 픽셀 블록.

데모는 : http://jsbin.com/nofowo/4/edit?css,output

당신은 불투명도의 환상이 적용되고 있던 위치를 확인하기 위해 figure::before { } 블록을 삭제할 수 있습니다.

figure { 
    width: 400px; 
    height: 440px; 

    background-image: 
     url('http://40.media.tumblr.com/9156a139784c4fde141fc379c7b5973d/tumblr_ngasc7M0dA1qhhnbao1_1280.jpg'), 
     url('http://36.media.tumblr.com/c1d431544107b313e5b2406b10387ccc/tumblr_ng6erxjLOp1qhhnbao1_1280.jpg'), 
     url('http://36.media.tumblr.com/f375f4052fff1849aa754a8df2d320a7/tumblr_nfzmz0Ckfe1qhhnbao1_1280.jpg'), 
     url('http://40.media.tumblr.com/801f19fea89afccb5f45d481a9399afa/tumblr_nfxteea7ss1qhhnbao1_1280.jpg'); 
    background-repeat: no-repeat, repeat-x, repeat-x, no-repeat; 
    background-position: center 22px, right center, right center, 0 0; 
    background-size: 42% 9%, 20% 15%, 20% 12%, 100% 100%; 
} 

figure::before { 
    content: ''; 
    width: 10px; 
    height: 10px; 
    position: absolute; 
    top: -49px; 
    left: 44px; 

    box-shadow: 
     70px 70px rgba(15,69,63,0.6), 
     80px 70px rgba(15,69,63,0.6), 
     90px 70px rgba(15,69,63,0.6), 
     100px 70px rgba(15,69,63,0.6), 
     110px 70px rgba(15,69,63,0.6), 
     120px 70px rgba(15,69,63,0.6), 
     130px 70px rgba(15,69,63,0.6), 
     140px 70px rgba(15,69,63,0.6), 
     150px 70px rgba(15,69,63,0.6), 
     160px 70px rgba(15,69,63,0.6), 
     170px 70px rgba(15,69,63,0.6), 
     180px 70px rgba(15,69,63,0.6), 
     190px 70px rgba(15,69,63,0.6), 
     200px 70px rgba(15,69,63,0.6), 
     210px 70px rgba(15,69,63,0.6), 
     220px 70px rgba(15,69,63,0.6), 
     230px 70px rgba(15,69,63,0.6), 
     70px 80px rgba(15,69,63,0.6), 
     80px 80px rgba(15,69,63,0.6), 
     90px 80px rgba(15,69,63,0.6), 
     100px 80px rgba(15,69,63,0.6), 
     110px 80px rgba(15,69,63,0.6), 
     120px 80px rgba(15,69,63,0.6), 
     130px 80px rgba(15,69,63,0.6), 
     140px 80px rgba(15,69,63,0.6), 
     150px 80px rgba(15,69,63,0.6), 
     160px 80px rgba(15,69,63,0.6), 
     170px 80px rgba(15,69,63,0.6), 
     180px 80px rgba(15,69,63,0.6), 
     190px 80px rgba(15,69,63,0.6), 
     200px 80px rgba(15,69,63,0.6), 
     210px 80px rgba(15,69,63,0.6), 
     220px 80px rgba(15,69,63,0.6), 
     230px 80px rgba(15,69,63,0.6), 
     70px 90px rgba(15,69,63,0.6), 
     80px 90px rgba(15,69,63,0.6), 
     90px 90px rgba(15,69,63,0.6), 
     100px 90px rgba(15,69,63,0.6), 
     110px 90px rgba(15,69,63,0.6), 
     120px 90px rgba(15,69,63,0.6), 
     130px 90px rgba(15,69,63,0.6), 
     140px 90px rgba(15,69,63,0.6), 
     150px 90px rgba(15,69,63,0.6), 
     160px 90px rgba(15,69,63,0.6), 
     170px 90px rgba(15,69,63,0.6), 
     180px 90px rgba(15,69,63,0.6), 
     190px 90px rgba(15,69,63,0.6), 
     200px 90px rgba(15,69,63,0.6), 
     210px 90px rgba(15,69,63,0.6), 
     220px 90px rgba(15,69,63,0.6), 
     230px 90px rgba(15,69,63,0.6), 
     70px 100px rgba(15,69,63,0.6), 
     80px 100px rgba(15,69,63,0.6), 
     90px 100px rgba(15,69,63,0.6), 
     100px 100px rgba(15,69,63,0.6), 
     110px 100px rgba(15,69,63,0.6), 
     120px 100px rgba(15,69,63,0.6), 
     130px 100px rgba(15,69,63,0.6), 
     140px 100px rgba(15,69,63,0.6), 
     150px 100px rgba(15,69,63,0.6), 
     160px 100px rgba(15,69,63,0.6), 
     170px 100px rgba(15,69,63,0.6), 
     180px 100px rgba(15,69,63,0.6), 
     190px 100px rgba(15,69,63,0.6), 
     200px 100px rgba(15,69,63,0.6), 
     210px 100px rgba(15,69,63,0.6), 
     220px 100px rgba(15,69,63,0.6), 
     230px 100px rgba(15,69,63,0.6); 
}