ASP.NET 母版页

简介

在 ASP.NET 中，母版页是一种用于创建具有共同外观和布局元素的网页模板。通过使用母版页，可以更简洁地管理网站的外观和布局，提高开发效率。本文将介绍使用 ASP.NET 创建母版页的基本概念和示例代码。

母版页的创建

在 ASP.NET 中创建母版页非常简单。首先，需要创建一个母版页文件，通常使用 .master 扩展名。以下是一个简单的母版页示例：

<!DOCTYPE html>
<html>
<head>
    <title>母版页示例</title>
</head>
<body>
    <!-- 定义母版页的布局 -->
    <div>
        <header>
            <!-- 头部内容 -->
        </header>
        <nav>
            <!-- 导航菜单 -->
        </nav>
        <main>
            <!-- 主要内容 -->
            <!-- 子页面将填充到这里 -->
        </main>
        <footer>
            <!-- 页脚内容 -->
        </footer>
    </div>
</body>
</html>

在母版页中，可以通过使用 div、header、nav、main 和 footer 等标签来定义页面的布局。主要内容的部分是空白的，它将由子页面填充。

子页面的继承

使用母版页的关键是创建子页面，并让子页面继承母版页的布局和外观。以下是一个子页面的示例：

<%@ Page Title="子页面示例" Language="C#" MasterPageFile="~/Site.master" CodeFile="Default.aspx.cs" Inherits="Default" %>

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
    <!-- 子页面的内容 -->
</asp:Content>

在子页面的头部，通过 Page 指令的 MasterPageFile 属性指定母版页文件的路径。Content 标签用于指定子页面的内容将填充到母版页的哪个部分。在上面的示例中，ContentPlaceHolderID 属性设置为 MainContent，这意味着子页面的内容将填充到母版页的 main 部分。

动态内容

除了定义共享的布局和外观，母版页还可以包含动态内容。通过使用 ASP.NET 的服务器控件，可以在母版页和子页面中添加动态内容。

以下是一个在母版页中添加动态标题的示例：

<head runat="server">
    <title><asp:ContentPlaceHolder ID="TitleContent" runat="server"></asp:ContentPlaceHolder></title>
</head>

在母版页的头部，使用 ContentPlaceHolder 控件创建一个占位符，用于显示标题。在子页面中，可以通过 TitleContent 来设置页面的标题：

<asp:Content ID="Content2" ContentPlaceHolderID="TitleContent" runat="server">
    子页面标题
</asp:Content>

同样的方式，可以添加其他动态内容，例如导航菜单、页脚等。

示例

下面是一个完整的示例，展示了一个使用母版页的简单网站结构：

<!-- Site.master -->
<%@ Master Language="C#" CodeFile="Site.master.cs" Inherits="SiteMaster" %>

<!DOCTYPE html>
<html>
<head runat="server">
    <title><asp:ContentPlaceHolder ID="TitleContent" runat="server"></asp:ContentPlaceHolder></title>
</head>
<body>
    <form runat="server">
        <header>
            网站标题
        </header>
        <nav>
            <ul>
                <li><a rel="nofollow" href="Default.aspx">首页</a></li>
                <li><a rel="nofollow" href="About.aspx">关于我们</a></li>
                <li><a rel="nofollow" href="Contact.aspx">联系我们</a></li>
            </ul>
        </nav>
        <main>
            <asp:ContentPlaceHolder ID="MainContent" runat="server"></asp:ContentPlaceHolder>
        </main>
        <footer>
            版权所有 © 2021
        </footer>
    </form>
</body>
</html>

<!-- Default.aspx -->
<