4

在我的 MVC 应用程序中，我引用了一个 CSS 文件来呈现页面的背景图像。我尝试了所有类型的可能性，例如

background: url(../Images/login-box-backg.png) no-repeat left top;
background: url(../../Images/login-box-backg.png) no-repeat left top;
background: url(~/Images/login-box-backg.png) no-repeat left top;
background: url(./Images/login-box-backg.png) no-repeat left top; works only in Firefox
background: url(/Images/login-box-backg.png) no-repeat left top;

background-image: url(/Images/login-box-backg.png) no-repeat left top;
background-image: url(../Images/login-box-backg.png) no-repeat left top;
background-image: url(../../Images/login-box-backg.png) no-repeat left top;
background-image: url(~/Images/login-box-backg.png) no-repeat left top;
background-image: url(./Images/login-box-backg.png) no-repeat left top;


但它显示无法在 Firefox 和 IE9 中加载给定的 url 和网络错误 404。
CSS 文件* login-box.css *

#login-box {
    width:333px;
    height: 352px;
    padding: 58px 76px 0 76px;
    color: #ebebeb;
    font: 12px Arial, Helvetica, sans-serif;
    background: url(../Images/login-box-backg.png) no-repeat left top;
}
.reg_body
        {
            background-image: url(../Images/plain-blue-background-images-7117.jpg);
        }

我的视图中的样式参考为

<link href="@Url.Content("~/CSS/login-box.css")" rel="stylesheet" type="text/css" />

将背景图像从 CSS 文件渲染到 MVC 视图的正确格式是什么。
我想知道为什么它在 IIS 中托管时不接受任何格式。
有什么建议么。

4

2 回答 2

3

不要提供这种类型的网址

background-image: url(../Images/plain-blue-background-images-7117.jpg);

用这个

background-image: url(/Images/plain-blue-background-images-7117.jpg);

如果它不起作用...然后尝试删除斜杠 /Images/ 到 Images/

于 2013-04-03T07:02:57.167 回答
1

将您Images的文件夹移动到该Content文件夹​​，并在您的 CSS 中使用它：

background-image: url(Images/login-box-backg.png) no-repeat left top;

您的文件夹结构应如下所示：

  • 内容
    -- 图片
    ---- login-box-backg.png
    -- Site.css
于 2013-04-03T07:19:02.807 回答