html - 将 svg 添加到网页?

标签 html css svg

<分区>

如何将 svg 添加到我的网页并通过 css 更改它的颜色?

我试过:

<img src="my.svg" class="svg"/>

.svg{
    fill: white;
}

但没有运气。

请使用纯 CSS 解决方案,我不需要任何回退,只支持新的浏览器。

最佳答案

这样不行。如果您直接包含 svg,则可以更改填充颜色,即:

HTML:

<p>Some other webpage content</p>
<svg class="my-svg">
    <g>
        <path fill="..."></path>
        <path fill="..."></path>
    </g>
</svg>
<p>Some other webpage content</p>

CSS:

.my-svg *{
    fill:white;
}

因此,您对 my.svg 进行网络检查,并将其内容复制粘贴到目标页面。然后你可以设计它。

关于html - 将 svg 添加到网页?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31357689/

相关文章:

javascript - 使用 raphaeljs javascript 图形库清除容器的最简单方法

css - 我可以在本地测试 Windows 8.x 中的 Safari 7.0 吗?

css - 将 z-index 应用于 SVG 路径

iphone - 如何让网站在 iPhone 和 iPad 上显示更好? (宽度太小)

html - respond.js 可以处理内部样式表

javascript - CSS - 过渡在 JavaScript for 循环中无法正常工作

html - 无法应用 CSS,可能是因为 Bootstrap

flutter - Flutter应用程序的自定义图标显示了手动转换为复合路径的错误

html - body 和 html 的高度为 100%,但我仍然无法在 div 上设置高度

jquery - 流体宽度元素的等高行