出现背景图片未显示的问题

Question

我的背景图片没有显示，它使我发疯，因为我知道这很容易。

下面的div类是我试图显示背景的地方。

.sun-face{
    background-image: url("./images/Sun_face.svg");
}


<div class="sun-face"></div>

我的文件目录的结构如下。

ROOT
    -css
    -fonts
    -images
    -js
    index.html
    navbar.html
    signin.html

Answer 1

使用这个CSS

.sun-face{
background-image: url("../images/Sun_face.svg");
height:500px;
}

Answer 2

我以前遇到过此问题，它是由mime型服务器问题引起的。 基本上，服务器未配置为提供.svg文件。 检查控制台，通常情况下，您会看到类似“将资源解释为图像，但以MIME类型传输的信息...”之类的信息。 可以通过在服务器上添加几行.htaccess文件来解决此问题。 请参阅此CSS技巧文章 。

Answer 3

所以我将其添加到内联样式表中

这可行，但是我想要在我的css文件中

 <style>
    .sun-face{
        background-image: url("./images/Sun_face.svg");
        height:500px;
        width:100%:
    }
    </style>


<link href="./css/custom.css" rel="stylesheet">

我把它放在^^不起作用？