Html 为什么这个svg不能作为css中的背景图像使用？

我通过illustrator和阅读制作了这个.svg：

它是可见的

但是，如果我使用此CSS将.svg设置为背景图像：

.svg-hexagon
{
    width: 10%;
    min-width: 150px;
}

.svg-hexagon-bg
{
    width: 200px;
    height: 200px;
    background-size: cover;
    background-position: center center;
    background-image: url("hexagon-bg.svg");
}

然后在我的html中调用它，如下所示：

<object type="image/svg+xml" data="hexagon-bg.svg" class="svg-hexagon"></object>

<div class="svg-hexagon-bg"></div>

---

它是看不见的。有人知道这是为什么吗。我想将其显示为背景图像，以便以不同的分辨率将其更改为正方形。

如果使用SVG作为背景图像（或任何其他图像上下文，如通过img文件），则它必须是自包含的，即它不能有任何外部引用，如外部CSS文件或在本例中为外部jpg文件

---

如果希望这样做，您需要将jpg文件转换为。如果您使用SVG作为背景图像（或任何其他图像上下文，如通过img文件），则它必须是自包含的，即它不能有任何外部引用，如外部CSS文件或在本例中为外部jpg文件

如果你想让它工作，你需要将jpg文件转换成一个文件

<div class="svg-hexagon-bg"></div>