Question

所以，我想制作所有带有棕褐色效果的图像，但是我在SVG中用于灰度的代码，当改为棕褐色时不起作用......

这是灰度：a img { filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale"); }

这是棕褐色不起作用：img { filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id="sepia"><feColorMatrix type='matrix' values='0.393 0.769 0.189 0 0 0.349 0.686 0.168 0 0 0.272 0.534 0.131 0 0 0 0 0 1 0'/></filter></svg>#sepia"); }

有谁能告诉我棕褐色代码有什么问题？

因为我要问有没有办法让图像既棕褐色又能使用灰度图像，并且可以使用像网页工具包这样的不透明度来制作图像-webkit-filter: grayscale(1) sepia (0.2);？

Answer 1

我猜是[id =“sepia”]中的双引号。此外，你的棕褐色值似乎有点偏。这是开始棕褐色的更好的地方：

       "0.30 0.30 0.30 0 0
        0.25 0.25 0.25 0 0
        0.20 0.20 0.20 0 0
        0.00 0.00 0.00 1 0"

在你的另一个问题上，你可以使用<animate>在颜色矩阵值之间设置动画，但是svg动画在IE（甚至IE10）上不起作用，所以你必须编写有意义的脚本。（更新 - 你可以尝试用于IE的FakeSMIL javascript库 - 它可以处理大多数SMIL。）

使所有图像sepia svg代码不起作用？

1 个答案: