我正在尝试使用css反转带有.svg扩展名的图像文件.我知道.png和.jpg文件可以使用css webkit属性反转.我是svg图片的新手.是否可以使用css反转.svg图像？
我试过用
-webkit-filter:invert(1);
filter:invert(1);
但它不起作用.
解决方法
只需直接设置SVG元素的样式即可
svg {
-webkit-filter: invert(100%); /* safari 6.0 - 9.0 */
filter: invert(100%);
}
从IE9及更高版本开始,can在< img src =“”/>中使用SVG元件.
img { /* svg on an img tag */
-webkit-filter: invert(.75); /* safari 6.0 - 9.0 */
filter: invert(.75);
}
<img src="https://cdn.sstatic.net/Sites/stackoverflow/company/img/logos/so/so-logo.svg" />
您可以将此金额设置为百分比或数字,如docs所示
The amount of the conversion,specified as a
<number>or a
<percentage>. A value of100%is completely inverted,while a value of
0%leaves the input unchanged. Values between0%and100%are linear
multipliers on the effect. The lacuna value for interpolation is0.
