将SVG图标用作DIV容器的背景

Question

我有一个svg图标，你可以在这里找到它（它是白色的），我想将其用作

的背景。我该如何做？

我已经尝试了以下代码，但什么也没有显示出来：

.show_nav {
    background-image: url('http://mobileglas.tryit.ch/fileadmin/media/images/Mobile_kreuz.svg');
    height: 5px; 
    width:30px;
}

- Pom Canys

---

它在那里，但它没有调整大小，因为你内置了固定大小值。如果你想要它缩放，你可能需要移除那些值。 - Paulie_D

Answer 1

您的背景太小，无法看到十字架。如果您想要缩放十字架，请将SVG宽度和高度值更改为100%，而不是px值。

.show_nav {
    background-color: black;
    background-image: url('http://mobileglas.tryit.ch/fileadmin/media/images/Mobile_kreuz.svg');
    height: 320px; 
    width:530px;
}

<div class="show_nav"></div>

- Robert Longson

Answer 2

你的svg文件太大了，有很多空白。你可以尝试两件事情：

1. 你可以尝试将视口(viewbox)更改为 (456 256 960 563)；或者
2. 在Adobe Illustrator中简单调整此svg的大小，并删除绘图板上的额外空间。

- Rajan471