Question

一段时间以来，我一直在尝试将svg图像添加到django网站。但是，我不断收到此错误： GET http://localhost:8000/images/enter.svg 404 (Not Found)

这就是我写的 <img src='/images/enter.svg'>

我的文件夹结构就是这样

index.html
-图片
-enter.svg

我一直在四处搜寻，但找不到解决方案。我听到有人复制并粘贴svg的“数据”，但是我还没有找到一个例子。以防万一它实际上有用，这是我尝试附加到页面上的svg图像的数据：

<?xml version="1.0"?>

<!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.0//EN' 'http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd'>
<svg fill-opacity="1" xmlns:xlink="http://www.w3.org/1999/xlink" color-rendering="auto" color-interpolation="auto" text-rendering="auto" stroke="black" stroke-linecap="square" stroke-miterlimit="10" shape-rendering="auto" stroke-opacity="1" fill="black" stroke-dasharray="none" font-weight="normal" stroke-width="1" xmlns="http://www.w3.org/2000/svg" font-family="&apos;Dialog&apos;" font-style="normal" stroke-linejoin="miter" font-size="12" stroke-dashoffset="0" image-rendering="auto">
  <!--Unicode Character 'DOWNWARDS ARROW WITH CORNER LEFTWARDS' (U+21B5)-->
  <defs id="genericDefs" />
  <g>
    <g>
      <path d="M159.3281 330.8906 L76.6406 330.8906 Q92.5312 348.75 99.4219 368.8594 L89.2969 368.8594 Q69.6094 340.1719 34.5938 327.375 L34.5938 320.4844 Q69.6094 307.6875 89.2969 279 L99.4219 279 Q92.5312 299.25 76.6406 317.1094 L145.4062 317.1094 L145.4062 215.7188 L159.3281 215.7188 L159.3281 330.8906 Z" stroke="none" />
    </g>
  </g>
</svg>

Answer 1

您好，您的svg代码似乎无法正常工作，因此我认为，如果您将这段代码放在您希望将svg放置到任何地方，它都可以工作：

<svg width="124.73px" height="153.14px" viewBox="0 0 124.73 153.14">
<g>
    <g>
        <path d="M124.73,115.17H42.05c10.59,11.91,18.19,24.56,22.78,37.97H54.7C41.58,134.02,23.34,120.19,0,111.66v-6.89
            c23.34-8.53,41.58-22.36,54.7-41.48h10.12c-4.59,13.5-12.19,26.2-22.78,38.11h68.77V0h13.92V115.17z"/>
    </g>
</g>
</svg>

当然可以将其转换为svg文件，然后在尝试时将其链接到您的代码中。但是您也可以将上面的代码放入代码中。例如：

<html>
<body>
<h1> some content or whatever </h1>
    <svg width="124.73px" height="153.14px" viewBox="0 0 124.73 153.14">
    <g>
        <g>
            <path d="M124.73,115.17H42.05c10.59,11.91,18.19,24.56,22.78,37.97H54.7C41.58,134.02,23.34,120.19,0,111.66v-6.89
                c23.34-8.53,41.58-22.36,54.7-41.48h10.12c-4.59,13.5-12.19,26.2-22.78,38.11h68.77V0h13.92V115.17z"/>
        </g>
    </g>
    </svg>
</body>
</html>

这样，它应该会显示在您的页面上，而不会出现链接问题。现在，您还可以通过给path指定一个ID来设置svg的样式。 https://css-tricks.com/lodge/svg/此页面上有很多教程，它们对svg的帮助很大。

希望这行得通！

加载网页后找不到本地svg图像

1 个答案: