CSS 背景图像拒绝在 ASP.Net MVC 中显示

我在 ASP.NET MVC 2 应用程序中显示背景图像时遇到问题。目前，在 ~/Views/Shared/Site.master 中，我将样式表的链接设置为：

<link href="<%:@Url.Content("~/Content/Site.css") %>" rel="stylesheet" type="text/css" />

我计划显示的图像位于我的 ~/Content/Images/Designs.png 中

这是我尝试过的

body
{
    background-image: url(~/Content/Images/designs.png); 
    background-repeat: repeat;  
    font-size: .75em;
    font-family: Verdana, Helvetica, Sans-Serif;
    margin: 0;
    padding: 0;
    color: #696969;
}

其他尝试包括：

background-image: url(./Content/Images/designs.png); 
background-image: url(Content/Images/designs.png); 
background-image: url(Images/designs.png); 

上述尝试均无效。我能做些什么？

CSS 文件内的 url 是相对于 CSS 文件的位置的。

所以如果我们假设你有~/content/foo.css你想包括~/images/foo.png这是在里面引用它的方法foo.css:

background-image: url(../images/foo.png); 

不要使用任何~在 CSS 文件内。它没有任何意义。

所以在你的情况下，如果 CSS 文件是~/Content/Site.css你想参考~/Content/Images/Designs.png正确的语法是：

background-image: url(images/designs.png); 

如果这对您不起作用，可能有不同的原因：

• 该位置不存在该图像
• 您没有指定包含元素的宽度和高度，因此您看不到图像

我建议您使用 FireBug 并检查相应的 DOM 元素，以准确查看应用了哪些样式和图像。