SVG из внешнего файла спрайта - PullRequest
1 голос
/ 12 февраля 2020

Чего мне здесь не хватает ...

Я пытаюсь отобразить svg lo go из внешнего файла спрайта.

Насколько я знаю кодирование является правильным, путь URL-адреса, безусловно, является правильным, поскольку логотипы отображаются при использовании, а файл .svg выглядит нормально, как и при использовании <img>.

Чего мне не хватает?

Вот мой html код

<!DOCTYPE html>
<html lang="en">
<head>

    <!-- IMPORTANT META TAGS -->
    <title>Test Site</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="description" content="test site" />
    <meta name="keywords" content="Test Site" />
    <meta name="robots" content="all" />

</head>
<body>
    <div>svg</div>
    <svg class="icon" viewBox="0 0 32 32">
        <use href="test.svg#menu"></use>
    </svg>

<br />
<br />
<br />
<div>img</div>
    <img src="test.svg" alt="Kiwi standing on oval">
</body>
</html>

1 Ответ

0 голосов
/ 12 февраля 2020

Вы ссылаетесь на внешний файл неправильно. Вам нужно использовать xlink:href, а не href:

<svg viewBox="0 0 100 100">
   <use xlink:href="test.svg#menu"></use>
</svg>
...