母版页徽标未显示在子文件夹中的新网络表单上

问题描述

我是母版页的新手,所以如果这是一个愚蠢的问题,请多多包涵。我有一个母版页,在菜单栏顶部具有公司徽标图像。我用母版页创建了一个新的Web表单。创建新页面后,将其移动到名为berkeley_heights的子文件夹中。当我以Chrome浏览器查看页面时,它显示菜单栏,但不显示菜单栏上方的徽标图像。我该如何解决这个问题。

Solution Explorer屏幕快照显示了子文件夹的位置:Solution Explorer

屏幕截图显示了没有徽标图像的新Web表单:image error

母版页:

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="MasterPage.master.cs" Inherits="OnCallWeb.MasterPage" %>

<!DOCTYPE html>

<html>
<head runat="server">
    <title>Union County dispatch Website</title>
    <link rel="stylesheet" href="MenuStyle.css" />
    <style>
        body {
            background-color:gainsboro;
            background-size:cover;
            background-attachment:fixed;
        }

    </style>
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <nav>
                <div><img src="img/Websitelogo3Transparent.png" /></div>
                <label class="toggle" for="drop">Menu</label>
                <input type="checkBox" id="drop" />

                <ul class="menu">
                    <li><a href="#">Main Menu</a>
                        <ul>
                            <li><a href="#">911 Calltaking Polices</a>
                                <ul>
                                    <li><li>
                                    <li><a href="#">County Police</a></li>

带有母版页的新Web表单(“ bh_main_page.aspx)

<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.Master" AutoEventWireup="true" CodeBehind="bh_main_page.aspx.cs" Inherits="OnCallWeb.WebForm1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder2" runat="server">
    <style type="text/css">
    .auto-style1 {
        text-align: center;
    }
    .auto-style2 {
        text-align: center;
        font-size: large;
    }
    .auto-style3 {
        font-size: x-large;
        color: #006666;
    }
</style>
    <div style="font-family: Arial,Helvetica,sans-serif">

解决方法

可能是相对路径问题吗?也就是说,徽标的src是"img/WebsiteLogo3Transparent.png"-将显示在主页上。例如www.site.com/img/WebsiteLogo3Transparent.png

一旦调用MasterPage的页面位于子文件夹中,浏览器就会期望该子文件夹中有一个名为“ img”的文件夹。例如www.site.com/subfolder/img/WebsiteLogo3Transparent.png

通过在源中添加域或将图片标签更改为

进行测试

<img src="~/img/WebsiteLogo3Transparent.png" runat="server" />"