Skip to content

blend-mode

blend-mode 数据类型表示混合模式值。

示例

css
/* background-blend-mode */
.element {
  background-blend-mode: normal;
  background-blend-mode: multiply;
  background-blend-mode: screen;
  background-blend-mode: overlay;
  background-blend-mode: darken;
  background-blend-mode: lighten;
  background-blend-mode: color-dodge;
  background-blend-mode: color-burn;
  background-blend-mode: hard-light;
  background-blend-mode: soft-light;
  background-blend-mode: difference;
  background-blend-mode: exclusion;
  background-blend-mode: hue;
  background-blend-mode: saturation;
  background-blend-mode: color;
  background-blend-mode: luminosity;
}

/* mix-blend-mode */
.element {
  mix-blend-mode: normal;
  mix-blend-mode: multiply;
  mix-blend-mode: screen;
  mix-blend-mode: overlay;
  mix-blend-mode: darken;
  mix-blend-mode: lighten;
  mix-blend-mode: color-dodge;
  mix-blend-mode: color-burn;
  mix-blend-mode: hard-light;
  mix-blend-mode: soft-light;
  mix-blend-mode: difference;
  mix-blend-mode: exclusion;
  mix-blend-mode: hue;
  mix-blend-mode: saturation;
  mix-blend-mode: color;
  mix-blend-mode: luminosity;
}

相关资源