您可以使用 CSS 设置 SVG 背景图像的样式吗？

通过 CSS 设置 SVG 背景图像的样式

当用作背景图像时，您可以使用设置为相同的 CSS 文件来设置 SVG 样式吗

虽然您可以成功定位、缩放和剪辑 SVG 图像（单独或作为精灵），但在将其指定为背景图像的同一个 CSS 文件中设置 SVG 样式是不可行的。

考虑以下伪CSS代码，其目的是根据其父元素的类来改变形状的颜色：

element1 {
    background-image(icon.svg);
}

element1.black .svg-pathclass {
    fill: #000000;
}

element1.white .svg-pathclass {
    fill: #ffffff;
}

这种方法假设SVG包含带有“svg-pathclass”的路径" class，是行不通的。

原因在于 SVG 和 CSS 的本质。 SVG 是一个独立的文档，可以在数据 URI 中准备或从外部引用。一旦在另一个文件中用作背景图像，它就成为不可通过 CSS 修改的不可变图像。

以上是您可以使用 CSS 设置 SVG 背景图像的样式吗？的详细内容。更多信息请关注PHP中文网其他相关文章！