当用作背景图像时，我的SVG图像会忽略其样式表 [英] My SVG image ignores its stylesheet when used as background image

问题描述

我有一个使用CSS设置样式的SVG图标.使用<link>标签从SVG文件本身中加载CSS.

I'm have an SVG icon that I style using CSS. The CSS is loaded from within the SVG file itself using a <link> tag.

当我将SVG用作背景图像时，尽管在直接访问所述SVG时未应用任何样式，但效果很好.

When I use that SVG as a background image though no styles are applied while visiting said SVG directly, it works fine.

这是一个示例

Here is an example

你知道怎么了吗?

推荐答案

这就是SVG用作图像时的工作方式.数据必须在单个文件中完整，以保护用户的隐私.

That's how SVG works when used as an image. The data must be complete in a single file in order to protect user's privacy.

您需要的思维模型是，它可以像光栅图像一样工作并起作用，它们也是单个文件.

The mental model you need is that it's going to work and act in a similar way to a raster image, they are single files too.

您仍然可以使用<link>标记，但是必须将数据编码为数据svg文件本身中的URI .

You can still use a <link> tag but you'd have to encode the data as a data URI within the svg file itself.

这篇关于当用作背景图像时，我的SVG图像会忽略其样式表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！