css - 从 css 更改 SVG 颜色

标签 css svg

<分区>

我有这个 CSS:

div {
  display: block;
  text-indent: -9999px;
  width: 100px;
  height: 100px;
  background: url(http://s.cdpn.io/3/kiwi.svg) no-repeat center;
  background-size: 82px 82px;
  border:solid 5px black;
  border-radius:200px;
  padding:25px;
}

是否可以从 css/jquery 更改 svg 颜色?
我不想直接从 html
如果不。我可以对 PNG 执行此操作吗?

http://jsfiddle.net/g8GPf/

谢谢

最佳答案

简单的答案是否定的。您不能使用 CSS 为以这种方式嵌入的 SVG 设置样式。

但是您可以使用 Ravi 链接的技巧将 SVG 引用更改为内联 SVG。

另一个替代技巧是更改 SVG,以便您想要显示为颜色的部分在 SVG 中是透明的。并使 SVG 的“背景”为纯白色。 然后您可以更改 background-color<div>它将通过 SVG 的透明部分显示。

关于css - 从 css 更改 SVG 颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19592434/

上一篇:html - 表格内容溢出到其他div

下一篇:css - 在一个父 div 标签中显示三个 div 标签

相关文章:

html - 带填充的容器内的可滚动 div

html - 如何摆脱div元素中svg下方的多余空间

html - SVG 屏蔽一个元素

css 动画跨浏览器变化

animation - 如何检测SVG动画是否可用

javascript - 样式输入类型文件中没有选择文件消息

jquery - 在杂乱的代码周围硬包装 div

html - 如何对背景图像的特定区域施加模糊效果?

animation - Firefox 和 IE 中的 css 关键帧动画

javascript - 有什么方法可以用不同的文件制作 200 个相似的 div(page0.svg、page1.svg...、page200.svg)