background-blend-mode
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.
A propriedade CSS background-blend-mode
descreve como as imagens de fundo do elemento devem se misturar entre si e a cor de fundo do elemento.
/* Um valor */
background-blend-mode: normal;
/* Dois valores, um por fundo */
background-blend-mode: darken, luminosity;
/* Valores globais */
background-blend-mode: initial;
background-blend-mode: inherit;
background-blend-mode: unset;
Os modos de mistura devem ser definidos na mesma ordem que a propriedade CSS background-image
. Se os comprimentos da lista dos modos de mistura e das imagens de fundo não forem iguais, ele será repetido e/ou truncado até que os comprimentos correspondam.
Initial value | normal |
---|---|
Aplica-se a | All elements. In SVG, it applies to container elements, graphics elements, and graphics referencing elements.. It also applies to ::first-letter and ::first-line . |
Inherited | não |
Computed value | as specified |
Animation type | Not animatable |
Sintaxe
Valores
<blend-mode>
-
É um
<blend-mode>
denotando o modo de mesclagem a ser aplicado. Pode haver vários valores, separados por vírgulas.
Sintaxe formal
background-blend-mode =
<mix-blend-mode>#
Exemplos
Especificações
Specification |
---|
Compositing and Blending Level 2 # background-blend-mode |
Compatibilidade com navegadores
BCD tables only load in the browser