通过img引入的svg如何改颜色?
2024-06-12 本文已影响0人
仰望天空的人
1.svg标签直接在页面中
需要把html内svg的fill删掉
svg {
fill: red;
}
2.通过img引入的svg文件
此时css对svg文件无法生效,此时要用到CSS3滤镜filter中的drop-shadow,通过生产一个可指定颜色的阴影放置于svg的位置,并将原始svg移出视线
<img src="img/success.svg">
img{
position: relative;
transform: translateX(-80px);
filter: drop-shadow(#f00 80px 0);
border-left: 4px solid transparent;
border-right: 4px solid transparent;
}
drop-shadow可用于jpg 、png图片变色