html - 背景图片 url 在生产服务器上不起作用

Question

在 VS 2013 localhost 中，背景图像使用以下设置可以完美工作:

.body-content {
    padding-left: 15px;
    padding-right: 15px;
    height: 100%;

    background-image: url("/Content/Img/MainPageBackground.jpg");

    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: 100% 100%;
    background-position: center;
}

但是部署到生产服务器(IIS7)后，背景图像不显示。 由于图像现在存储在不同的位置，我知道必须相应地更新 url 路径。但是，我尝试了所有路径组合，但没有成功。图像在服务器中的新位置是

C:\App\Clients\HDC\Client\Content\Img\MainPageBackground.jpg

这不起作用，它的任何缩短组合都不起作用。

background-image: url("C:/App/Clients/HDC/Client/Content/Img/MainPageBackground.jpg")
background-image: url("/App/Clients/HDC/Client/Content/Img/MainPageBackground.jpg")

等等......

注意:虚拟目录为“C:\App\Clients\HDC\Client”

Answer 1

您可以做的一件事就是尝试在服务器上查找该文件!

例如，在 URL 中输入 site.com/Content/Img/MainPageBackground.jpg

看看它的行为是否符合您的预期

此外，我建议全部使用小写，Windows 不区分大小写，但其他操作系统通常区分大小写!

=)

编辑

哦，我明白了。除非您想转到根目录，否则不要在 Content 之前使用/!所以删除/并尝试!

background-image: url("Content/Img/MainPageBackground.jpg");

如果您需要后退几步并向上移动目录，就像这样完成

background-image: url("../../Content/Img/MainPageBackground.jpg"); 

但是没有足够的信息来告诉你到底需要什么 = )