Comment modifier les couleurs de remplissage de l'image d'arrière-plan SVG avec CSS ?

Comment modifier les couleurs de remplissage des images d'arrière-plan SVG

Lorsqu'il est en ligne, CSS peut facilement modifier les couleurs de remplissage SVG. Cependant, modifier les attributs de remplissage lorsqu'un SVG est utilisé comme image d'arrière-plan pose un défi.

Voici comment y parvenir à l'aide de masques CSS :

.element {
    background-color: red;
    -webkit-mask-image: url(icon.svg);
    mask-image: url(icon.svg);
}

Cela crée un masque basé sur les éléments fournis. Image SVG, en l'appliquant à l'élément spécifié. Par conséquent, la couleur d'arrière-plan de l'élément est affectée par les attributs de remplissage du SVG.

Pour plus de détails, reportez-vous à cet article perspicace : https://codepen.io/noahblon/post/coloring-svgs-in-css- images d'arrière-plan

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!