母版页图像未显示在内容页面中？答案

【问题标题】：Master page image not displaying in content page?母版页图像未显示在内容页面中？
【发布时间】：2012-07-24 22:26:05
【问题描述】：

我有一个带有 div 标题的母版页。

#header
        {
             background-image: url("images/ST_ERP_2.jpg");
            background-repeat: no-repeat;
            background-position: right top;

            height: 200px;
            width: 1200px;
        }

下面是标题div

<div id="header" >
            <h1>
                Header goes here</h1>               
</div>

以上两个代码片段都在我的母版页中。

现在我有一个内容页面 (xyz.aspx)，它位于某个目录中。

图像 (ST_ERP_2.jpg) 位于 images 文件夹中。

现在，当我尝试在浏览器中查看页面 (xyz.aspx) 时，它不会显示我为 background-image 设置的图像，而是显示一个空白区域。可能是什么问题？

注意：

我也试过background-image: url("~/images/ST_ERP_2.jpg"); 但它对我没有帮助。
我正在使用 VS2010 和 ASP.NET

母版页：

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="Site.master.cs" Inherits="Site" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajax" %>
<%--<%@ Register Assembly="AccordionSiteMap" Namespace="FranchiseBlast.UserControls.Interface"
    TagPrefix="lb" %>--%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">

    <style type="text/css">

        #wrapper
        {
            background: #FFFFFF;
            margin: 0px auto;
            width: 1200px;
            height: 1024px;
        }

        #header
        {
             background-image: url("images/ST_ERP_2.jpg");
            background-repeat: no-repeat;
            background-position: right top;

            height: 200px;
            width: 1200px;
        }

        #footer
        {
            background: #838283;
            height: 40px;
            width: 1200px;
            margin: 600px 0px;
        }
    </style>
    <title></title>
</head>
<body style="background: LightBlue">
    <form id="form1" runat="server">
    <div id="wrapper">
        <div id="header" >
            <h1>
                Header goes here</h1>
            <br />

        </div>
        <!--Header-->


 .... content place holder and etc  ......


         <div id="footer" style="clear: both">
            <h3>
                Footer goes here</h3>
        </div>
        <!--Footer-->
    </div>
    </form>
</body>
</html>

【问题讨论】：

背景图像行是在母版页中还是在 .css 文件中？换句话说，您的母版页中有
我的母版页中有一个
@MartinBrown 查看母版页代码

标签： asp.net css visual-studio html master-pages

【解决方案1】：

尝试用这个替换背景图像：

background-image: url(<%=ResolveClientUrl("~/images/ST_ERP_2.jpg")%>);

【讨论】：

非常感谢...Martin........它工作正常...问题解决了！！快点！！！
您也可以使用 ResolveUrl(string) 与 ResolveClientUrl(string) 之间的区别在andornot.com/blog/post/ResolveUrl-vs-ResolveClientUrl.aspx中进行了解释

【解决方案2】：

试试：

background-image: url("../images/ST_ERP_2.jpg");

【讨论】：

我现在有三层目录，现在我已经按照您的指示进行了更改，它适用于具有一级目录的页面，但对于二级和三级目录内的页面也有同样的问题。非常感谢您的回答
对于目录的第二层 ../../ 第三层的笑脸 ../../../
我已经在母版页中定义了背景图像。查看我的母版页代码..我如何更改（您建议的）不同级别目录的页面？
您仍然没有更改您的网址。如果图像在母版页中定义，那么当您的页面加载到该母版页中时，查看该图像没有任何问题。无论该页面是否在目录级别2 或 3。我认为还有另一个问题。
我已经尝试过您建议的更改，但它不适用于除一级目录中的页面以外的页面...非常感谢您的回答