CSS를 이용한 이미지 multiply 기능 주기

적용 필요 조건으로는 같은 위치에 있는 두개의 이미지 (겹친 이미지) 에서 적용 가능하며 여러가지 활용이 가능함

<div class="img_box">
<img src="./이미지1" /> 
<img class="effiect" src="./이미지2" />
</div>
/* 이런 구조 형태 */

※ 각 적용 CSS 형태

.img_box img{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
object-fit:cover;
}
.img_box img.effiect{
mix-blend-mode:multiply;
filter:contrast(1.5);
}

STAY IN THE LOOP

Subscribe to our free newsletter.

[fusion_form form_post_id="4569" margin_bottom="0" hide_on_mobile="small-visibility,medium-visibility,large-visibility" /]

Related Posts

View all
  • Continue reading
  • Continue reading
  • Continue reading
  • Continue reading