[英]Background Image “Failed to load url” from CSS in MVC4 deployed in IIS 7.5
In my MVC application, I refered a CSS file to render a background image for the page. 在我的MVC应用程序中,我引用了一个CSS文件来呈现页面的背景图像。 I tried with all types of possibilities such as
我尝试过所有类型的可能性,例如
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;
But It shows failed to load the given url and network error 404 in both Firefox and IE9. 但它显示无法在Firefox和IE9中加载给定的URL和网络错误404。
CSS file * login-box.css * 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);
}
The style reference in my View as 我视图中的样式引用
<link href="@Url.Content("~/CSS/login-box.css")" rel="stylesheet" type="text/css" />
Which is the correct format to render background image from CSS file to MVC View. 将背景图像从CSS文件渲染到MVC视图的格式是正确的。
I wonder why it doesnt accept anyformat when hosted in IIS. 我想知道为什么它在IIS中托管时不接受任何格式。
Any suggestions. 有什么建议。
Dont give this type of URL 不要提供这种类型的URL
background-image: url(../Images/plain-blue-background-images-7117.jpg);
use this one 用这个
background-image: url(/Images/plain-blue-background-images-7117.jpg);
if its not work...then try to remove slash /Images/ to Images/ 如果它不起作用...然后尝试删除斜杠/图像/到图像/
Move your Images
folder to the Content
folder, and use this in your CSS: 将
Images
文件夹移动到Content
文件夹,并在CSS中使用它:
background-image: url(Images/login-box-backg.png) no-repeat left top;
Your folder structure should look like this: 您的文件夹结构应如下所示:
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.