ASP.NET Web Forms 中的母版页(Master Page)详解
母版页是 ASP.NET Web Forms 提供的一种模板机制,可以让你为网站的所有页面定义统一的外观和布局(如头部、导航栏、侧边栏、底部等),而内容页面(Content Page)只需要填写具体的内容部分。这样极大提高了代码复用率和维护效率。
1. 创建母版页
- 在解决方案资源管理器右键项目 → 添加 → 新项 → 选择“母版页”(Master Page)
- 默认文件名如 Site.master(或 Site.master.vb)
一个典型的母版页(Site.master)代码结构:
<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs" Inherits="WebApp.SiteMaster" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title><asp:ContentPlaceHolder ID="head" runat="server" /></title>
<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
<asp:ContentPlaceHolder ID="HeadContent" runat="server" />
</head>
<body>
<form id="form1" runat="server">
<div class="page">
<!-- 统一的头部 -->
<header>
<div class="logo">我的网站</div>
<nav>
<a href="~/Default.aspx">首页</a> |
<a href="~/About.aspx">关于</a> |
<a href="~/Contact.aspx">联系我们</a>
</nav>
</header>
<!-- 主内容区域 -->
<div class="main">
<asp:ContentPlaceHolder ID="MainContent" runat="server" />
</div>
<!-- 统一的底部 -->
<footer>
<p>© <%: DateTime.Now.Year %> - 我的公司</p>
</footer>
</div>
</form>
</body>
</html>
重要元素说明:
<%@ Master %>指令而不是<%@ Page %><asp:ContentPlaceHolder>:内容占位符,内容页面必须对应填充- 常用 ID:
head(放在<head>中)、MainContent、FeaturedContent等
2. 创建使用母版页的内容页面
添加新 Web 窗体时,选择“使用母版页的 Web 窗体”:
<%@ Page Title="首页" Language="C#" MasterPageFile="~/Site.Master"
AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApp.Default" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<!-- 可以在这里添加本页专用的 CSS 或 JS -->
<link href="css/home.css" rel="stylesheet" />
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<h2>欢迎来到首页!</h2>
<p>这里是页面的具体内容...</p>
<asp:Label ID="Label1" runat="server" Text="动态内容"></asp:Label>
</asp:Content>
关键点:
MasterPageFile="~/Site.Master"指定要使用的母版页- 每个
<asp:Content>必须对应母版页中的ContentPlaceHolderID - 只能放置在
<asp:Content>标签内,不能直接在页面写<html>、<head>、<body>等
3. 嵌套母版页(Nested Master Pages)
适用于大型网站需要多级布局(如后台管理有自己的母版,再继承站点主母版):
- 创建子母版页时同样选择“母版页”,但在页面指令加上
MasterPageFile="~/Site.Master" - 子母版页中也可以继续放
ContentPlaceHolder
<%@ Master Language="C#" MasterPageFile="~/Site.Master" ... %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<h3>后台管理专用布局</h3>
<div class="admin-sidebar">
<!-- 后台导航 -->
</div>
<div class="admin-content">
<asp:ContentPlaceHolder ID="AdminBody" runat="server" />
</div>
</asp:Content>
4. 在代码后台访问母版页控件
// 在内容页 .cs 文件中
protected void Page_Load(object sender, EventArgs e)
{
// 方法1:强转 Master 属性
SiteMaster master = (SiteMaster)this.Master;
master.SetPageTitle("自定义标题");
// 方法2:使用 @MasterType 指令(推荐,更安全)
}
// 在内容页 .aspx 顶部添加
<%@ MasterType VirtualPath="~/Site.Master" %>
// 然后直接使用
protected void Page_Load(object sender, EventArgs e)
{
Master.SetPageTitle("新标题"); // 自动强转
}
母版页中提供公共方法或属性:
public partial class SiteMaster : System.Web.UI.MasterPage
{
public void SetPageTitle(string title)
{
Page.Title = title + " - 我的网站";
}
}
5. 动态切换母版页
protected void Page_PreInit(object sender, EventArgs e)
{
// 必须在 PreInit 阶段设置
if (User.IsInRole("Admin"))
this.MasterPageFile = "~/AdminMaster.master";
else
this.MasterPageFile = "~/Site.Master";
}
6. 常见问题与技巧
- 忘记在 PreInit 设置 MasterPageFile 会报错
- 内容页必须有与母版页完全匹配的 ContentPlaceHolderID
- 想在内容页添加
<head runat="server">额外内容 → 在母版页的<head>里放一个ContentPlaceHolder ID="head" - 母版页不支持设计视图完美预览嵌套内容(VS2019 以后已大幅改善)
母版页是 Web Forms 时代最经典、最实用的功能之一,虽然现在很多人转到 ASP.NET Core + Razor Pages/MVC,但理解母版页的思路对任何模板系统设计都有帮助。希望以上内容能帮你快速掌握!需要完整示例项目也可以告诉我~