mix-blend-mode
SAMPLE
정의
요소의 내용이 배경과 혼합되는 방법을 지정
문법
mix-blend-mode: color;
mix-blend-mode: color-burn;
mix-blend-mode: color-dodge;
mix-blend-mode: darken;
mix-blend-mode: difference;
mix-blend-mode: exclusion;
mix-blend-mode: hard-light;
mix-blend-mode: hue;
mix-blend-mode: inherit;
mix-blend-mode: initial;
mix-blend-mode: lighten;
mix-blend-mode: luminosity;
mix-blend-mode: multiply;
mix-blend-mode: normal;
mix-blend-mode: overlay;
mix-blend-mode: screen;
mix-blend-mode: soft-light;
mix-blend-mode: unset;
기본
mix-blend-mode: normal;
속성
| normal | 블렌딩 모드를 noraml로 설정 |
| multiply | 블렌딩 모드를 multiply로 설정 |
| screen | 블렌딩 모드를 screen로 설정 |
| overlay | 블렌딩 모드를 overlay로 설정 |
| darken | 블렌딩 모드를 darken로 설정 |
| lighten | 블렌딩 모드를 lighten로 설정 |
| color-dodge | 블렌딩 모드를 color-dodge로 설정 |
| color-burn | 블렌딩 모드를 color-burn로 설정 |
| difference | 블렌딩 모드를 difference로 설정 |
| exclusion | 블렌딩 모드를 exclusion로 설정 |
| hue | 블렌딩 모드를 hue로 설정 |
| saturation | 블렌딩 모드를 saturation로 설정 |
| color | 블렌딩 모드를 color로 설정 |
| luminosity | 블렌딩 모드를 luminosity로 설정 |
| inherit | 블렌딩 모드를 inherit로 설정 |
| initial | 블렌딩 모드를 initial로 설정 |
| unset | 블렌딩 모드를 unset로 설정 |
브라우저 지원 시작 버젼
| IE | Edge | Firefox | Chrome | Safari | Opera |
| 지원 안함 | 79 | 32 | 41 | 8 | 28 |