2017-04-20 12 views
1
여기

내가 찾고 있어요 코드입니다 :div 스타일 요소의 배경 이미지에 CSS 필터를 적용 할 수 있습니까?

<div class="fullwidth-box vas_row-back1" style="background-color: 
rgba(99,59,0,0.79);background-image: 
url(&quot;http://example.com/wp-content/uploads/2015/11/myphoto.jpg&quot;);background-position: 
center center;background-repeat: 
no-repeat;padding-top:80px;padding-right:40px;padding-bottom:80px;padding-left:40px;margin-bottom: 
60px;margin-top: 
30px;-webkit-background-size:cover;-moz-background-size:cover;-o- 
background-size:cover;background-size:cover;background- 
attachment:none;"> 

내가 .vas_row-back1 클래스에 대한 CSS를 제어 할 수 있습니다,하지만 난 사업부의 = 스타일의 출력을 변경할 수 없습니다 테마가 그것을 창조하기 때문에.

이미지 배경에 필터를 적용하고 싶습니다. 내가 사용하는 경우 :

.vas_row-back1[style] { 
-webkit-filter: grayscale(80%); /* Safari */ 
filter: grayscale(80%); } 

을 필터는 내용을 포함 전체 사업부에 적용됩니다.

내가하려고하면 :

.vas_row-back1[style]:background-image { 
-webkit-filter: grayscale(80%); /* Safari */ 
filter: grayscale(80%); } 

그것은 전혀 등록하지 않습니다가, 클래스를 나누기. 필터가 DIV의 배경 이미지에만 적용되지만 내용은 적용되지 않도록 할 수 있습니다. 이게 가능하다고 생각하니? 생각?

답변

0

이 기본 div 안에 중첩 된 배경 이미지가있는 별도 div를 만들어야합니다.

또 다른 대안은 배경 스타일로 의사 요소 (:before/:after)를 사용하는 것입니다.