打开 Visual Web Developer。

在“文件”菜单上单击“新建网站”。

出现“新建网站”对话框。

在“Visual Studio 已安装的模板”之下单击“ASP.NET 网站”。

在“位置”框中输入要保存网站页面的文件夹的名称。

例如，键入文件夹名“C:\WebSites”。

在“语言”列表中，单击您想使用的编程语言。

单击“确定”。

Visual Web Developer 创建该文件夹和一个名为 Default.aspx 的新页。

在解决方案资源管理器中，右击网站的名称，然后单击“添加新项”。

在“Visual Studio 已安装的模板”之下单击“母版页”。

在“名称”框中键入“Master1”。

选中“将代码放在单独的文件中”复选框。

注意

本演练假设您为所有页面使用代码隐藏文件。如果使用的是单一文件 ASP.NET 页，本演练中阐释的代码也可以使用，但将在源视图中显示，而不是在单独的代码文件中显示。

在“语言”列表中，单击您想使用的编程语言，然后单击“添加”。

即会在源视图中打开新的母版页。

在页面的顶部是一个 声明，而不是通常在 ASP.NET 页顶部看到的 声明。页面的主体包含一个 <asp:contentplaceholder> 控件，这是母版页中的一个区域，其中的可替换内容将在运行时由内容页合并。在本演练的稍后部分将更多地使用内容占位符。

在源视图中选定 Master1.master 文件，将验证的目标架构设置为 Microsoft Internet Explorer 6.0。若要设置此值，可以使用工具栏中的下拉列表，或从“工具”菜单中选择“选项”，然后单击“验证”。

切换到“设计”视图。

从“属性”窗口顶部的下拉列表中选择“DOCUMENT”，然后将“BgColor”设置为特别的颜色，如蓝色。

选择什么颜色并不重要。在本演练的稍后部分，将创建没有颜色的第二个母版页，与在这里选择的颜色形成对比。

单击要放置布局表格的页面。

注意

请勿将布局表格放在 控件内。

在“布局”菜单上单击“插入表”。

在“插入表格”对话框中单击“模板”。在列表中单击“页眉、页脚和边”，然后单击“确定”。

此模板定义表格中行和单元格的排列方式。选定的模板创建三个行，中间行拆分为两个单元格。

进行以下设置：

在中间行中，单击最左侧的列，然后在“属性”窗口中将其“宽度”设置为 48。

单击首行，然后在“属性”窗口中将其“高度”设置为 48。

单击末行，然后在“属性”窗口中将其“高度”设置为 48。

注意

可以通过拖动表格单元格的边框或在“属性”窗口中选择单元格并设置值，来设置宽度和高度。

选中表格中的所有单元格，将“BgColor”设置与背景色不同的颜色，然后将“VAlign”设置为“顶部”。

单击底部单元格，然后键入页脚文本，如“Copyright 2005 Contoso Inc.”。

在“工具箱”中，从“导航”控件组将 控件拖动到顶部单元格中。

按照以下步骤创建菜单：

将 Menu 控件的 属性设置为 。

单击 Menu 控件上的智能标记，然后在“菜单任务”对话框中单击“编辑菜单项”。

在“项”之下单击“添加根节点”图标两次，添加两个菜单项：

单击第一个节点，然后将“Text”设置为“主页”，并将“NavigateUrl”设置为“Home.aspx”。

单击第二个节点，然后将“Text”设置为“关于”，并将“NavigateUrl”设置为“About.aspx”。

单击“确定”关闭“菜单项编辑器”对话框。

如果有可用作徽标的图形文件，请按照以下步骤将其放置到母版页上：

在解决方案资源管理器中，右击网站的名称，然后单击“添加现有项”。

定位到您的图形文件，选择该图形文件，然后单击“添加”。

在“工具箱”中，从“标准”组将 控件拖动到表格的左中列。

将 Image 控件的 属性设置为该图形文件的名称。

将 ContentPlaceHolder 控件拖动到右中单元格中。

控件的 ID 属性为 ContentPlaceholder1。您可以保留或更改此名称。如果更改此名称，请记下更改的名称，因为稍后需要知道此名称。

保存页。

在解决方案资源管理器中，右击网站的名称，然后单击“添加新项”。

在“Visual Studio 已安装的模板”下单击“Web 窗体”。

在“名称”框中键入“主页”。

在“语言”列表中，单击您想使用的编程语言。

选中“选择母版页”复选框，然后单击“添加”。

出现“选择母版页”对话框。

单击“Master1.master”，然后单击“确定”。

即会创建一个新的 .aspx 文件。该页面包含一个 指令，此指令将当前页附加到带有 MasterPageFile 属性的选定的母版页，如下面的代码示例所示。

<%@ Page Language="VB" MasterPageFile="~/Master1.master" ... %>

<%@ Page Language="C#" MasterPageFile="~/Master1.master" ... %>

此页面还包含一个 <asp:Content> 元素，稍后将使用此元素。

切换到“设计”视图。

母版页中创建为 ContentPlaceHolder 控件的区域在新的内容页中显示为 控件。显示剩下的母版页内容，以便您查看布局，但这些内容显示为浅灰色，因为您在编辑内容页时不能更改这些内容。

从“属性”窗口的下拉列表中单击“DOCUMENT”，然后将“标题”设置为“Contoso 主页”。

可以独立设置每个内容页的标题，以便内容与母版页合并时在浏览器中显示正确的标题。标题信息存储在内容页的 @ Page 指令中。

在 Content 控件中，键入“欢迎光临网站 Contoso”，选择该文本，然后将文本的格式设置为“标题 1”，方法是选择该文本，然后从“工具箱”上面的“块格式”下拉列表中选择“标题 1”。

按 Enter，在 Content 控件中创建一个新的空白行，然后键入“感谢您访问本站”。

在这里添加的文本并不重要，可以键入任何有助于将此页识别为主页的文本。

保存页。

使用与创建主页相同的步骤添加名为 About.aspx 的新内容页。

请确定将新页面附加到 Master1.master 页，正如对主页的操作一样。

将页面的标题更改为“Contoso‘关于’页面”。

在内容区域中，键入“关于 Contoso”，然后选择文本，并从“工具箱”上面的“块格式”下拉列表中选择“标题 1”，将文本的格式设置为“标题 1”。

按 Enter 以创建新行，然后键入“从 1982 年起，Contoso 一直提供优质的软件服务。”

保存页。

切换到 Home.aspx 页，然后按 Ctrl+F5。

ASP.NET 将 Home.aspx 页的内容与 Master1.master 页的布局合并到单个页面，并在浏览器中显示产生的页面。请注意，此页的 URL 为 Home.aspx；浏览器中不存在对母版页的引用。

单击“关于”链接。

显示 About.aspx 页。它亦与 Master1.master 页合并。

切换到或打开 Master1.master 页。

在解决方案资源管理器中，右击“Master1.master”，然后单击“查看代码”打开代码编辑器。

注意

默认情况下，Visual Web Developer 创建使用代码隐藏模型的页面。如果愿意，可以使用单一文件模型来创建代码。有关更多信息，请参见 。

在类定义中键入以下代码。

Public Property CompanyName() As StringGetReturn CType(ViewState("companyName"), String)End GetSet(ByVal Value As String)ViewState("companyName") = ValueEnd SetEnd Property

public String CompanyName{get { return (String) ViewState["companyName"]; }set { ViewState["companyName"] = value; }}

此代码为母版页创建名为 CompanyName 的属性。在视图状态中存储此值，以便此值在回发之间保持不变。

在类定义中（但并非在属性代码中）添加以下代码。

Sub Page_Init(ByVal sender As Object, ByVal e As EventArgs) _Handles Me.InitMe.CompanyName = "Contoso"End Sub

void Page_Init(Object sender, EventArgs e){this.CompanyName = "Contoso";}

在本示例中，将 CompanyName 属性的值硬编码到页中。

切换到或打开 Home.aspx 页。

切换到“源”视图。

在页面顶部的 指令下添加下面的 指令：

<%@ MasterType virtualpath="~/Master1.master" %>

此指令将内容页的 Master 属性（即将使用此属性）绑定到 Master1.master 页。

切换到“设计”视图。

在 Content 控件中，将文本更改为“欢迎光临网站”。

在“工具箱”中，从“标准”组将 控件拖动到 Content 控件上，并将其放置到静态文本的后面，使文本如下所示：

欢迎光临网站 [Label]

将 Label 控件的 属性设置为“CompanyName”。

在解决方案资源管理器中，右击“Home.aspx”，然后单击“查看代码”打开代码编辑器。

在类定义中添加下面的代码。

Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) _Handles Me.Load    CompanyName.Text = Master.CompanyNameEnd Sub

void Page_Load(Object sender, EventArgs e){   CompanyName.Text = Master.CompanyName;}

内容页的 属性返回对母版页的引用，此引用在步骤 3 中添加的 指令中定义。

切换到或打开 Home.aspx 页，然后按 Ctrl+F5 运行页面。

页面即会在浏览器中显示，其中文本为“欢迎光临网站 Contoso”。

关闭浏览器。

切换到或打开 Master1.master 代码隐藏页。

更改 Page_Init 处理程序，为属性赋一个不同的公司名，如下面的代码示例所示。

Sub Page_Init(ByVal sender As Object, ByVal e As EventArgs) _Handles Me.InitMe.CompanyName = "New Company Name"End Sub

void Page_Init(Object sender, EventArgs e){this.CompanyName = "New Company Name";}

切换到 Home.aspx 页，然后按 Ctrl+F5 以再次运行页面。

这次，更新的公司名显示在页面中。

使用母版页时还应注意其他几个问题：

在实际的应用中，可能将公司名等信息存储在配置文件中，并直接在内容页读取此信息。不过，在这里讲述的情形提供有关如何在内容页引用母版页成员的简单阐释。

即使没有包括 指令，也可以访问母版页上的成员。但是，若要执行此操作，必须将 System.Web.UI.Page.Master 属性强制转换为适当的母版页类型（如果页面没有母版页，则 Master 属性为 null）。有关更多信息，请参见。

可以使用 Master.FindControls 方法引用母版页上的控件。有关更多信息，请参见。

在解决方案资源管理器中，右击 Master1.master，然后单击“复制”。

右击网站的名称，然后单击“粘贴”。

即会将一个母版页添加到网站，名为“复件 master1.master”。

右击“复件 master1.master”，单击“重命名”，然后将新母版页命名为“Master2.master”。

打开 Master2.master，然后在 指令中将 Master1 更改为 Master2。

完成的页面指令类似于下面的代码示例。

<%@ Master Language="VB" CodeFile="Master2.master.vb" Inherits="Master2" %>

<%@ Master Language="C#" CodeFile="Master2.master.cs" Inherits="Master2" %>

切换到“设计”视图。

在“属性”窗口顶部的下拉列表中单击“DOCUMENT”。

清除“BgColor”属性。

新的母版页的外观和功能与 Master1.master 类似，但没有背景色。

打开 Master2.master 的代码文件，将母版页的代码隐藏文件中的类名从 Master1 更改为 Master2 以与页的 <%@ Master %> 指令中的 Inherits 属性的值相匹配。

代码类似于下面的示例。

Partial Class Master2

public partial class Master2 : System.Web.UI.MasterPage

切换到或打开 Master2.master 页。

在“工具箱”中，从“标准”节点，将 控件拖动到页面上，并将其放置在顶部表格单元格中的菜单之下。

将按钮的 属性设置为“Colorful”。

双击此按钮，为其 事件创建一个处理程序，然后添加以下突出显示的代码。

Protected Sub LinkButton1_Click(ByVal sender As Object, ByVal e As EventArgs)_Handles LinkButton1.Click    Session("masterpage") = "Master1.master"    Response.Redirect(Request.Url.ToString())End Sub

void LinkButton1_Click(Object sender, EventArgs e){   Session["masterpage"] = "Master1.master";   Response.Redirect(Request.Url.ToString());}

此代码将备用母版页的文件名加载到一个持久的会话变量中，然后重新加载当前页。（ 属性返回引用当前页的 对象。）很快将在使用母版页的名称的内容页中创建代码。

在“设计”视图中切换到或打开 Master1.master 页。

像在步骤 1 和 2 中一样添加一个 LinkButton 控件，并将其 Text 属性设置为“Plain”。

双击 Plain 按钮，为其 Click 事件创建一个处理程序，然后添加下面突出显示的代码。

Protected Sub LinkButton1_Click(ByVal sender As Object, ByVal e As EventArgs)_Handles LinkButton1.Click    Session("masterpage") = "Master2.master"    Response.Redirect(Request.Url.ToString())End Sub

void LinkButton1_Click(Object sender, EventArgs e){   Session["masterpage"] = "Master2.master";   Response.Redirect(Request.Url.ToString());}

此代码与 Master2.master 页中按钮的代码类似，不同之处在于它加载备用母版页。

切换到或打开 About.aspx 页。

注意

已经创建的主页包含一个 指令，此指令实际上将此页绑定到单个母版页 (Master1.master)。因此，将无法动态地将母版页分配到主页，而是使用其他已创建的页。

在解决方案资源管理器中，右击“About.aspx”，然后单击“查看代码”打开代码编辑器。

在类定义中添加下面的代码。

Sub Page_PreInit(ByVal sender As Object, ByVal e As EventArgs) _Handles Me.PreInitIf Not Session("masterpage") Is Nothing ThenMe.MasterPageFile = CType(Session("masterpage"), String)End IfEnd Sub

void Page_PreInit(Object sender, EventArgs e){if(Session["masterpage"] != null){this.MasterPageFile = (String) Session["masterpage"];}}

此代码将当前页的 属性的值设置为会话变量中的值（如果有）。此代码必须在 Page_PreInit 处理程序中运行；它无法在任何晚于 Page_PreInit 处理程序发生的处理程序中运行（例如，在 Page_Init 处理程序中），因为必须建立母版页，使得页面可以创建其实例，然后可以进一步初始化。

在 About.aspx 页中按 Ctrl+F5 运行此页面。

此页即会在浏览器中显示，它与其默认母版页 Master1.master 合并。

单击“Plain”链接。

即会重新显示此页，这一次它与没有背景色的 Master2.master 合并。

单击“Colorful”链接。

再次使用 Master1.master 显示该页。

使用动态母版页时还应注意其他几个问题：

为了使本演练专注于母版页，本节中更改母版页的情形已经简化。在实际应用中，很可能显示备选的一些布局，然后使用配置文件存储用户的首选项。有关详细信息，请参见 。

可以配置网站，使所有页面使用相同的母版页。可能会有几个页应使用备用母版页，可以用类似于本演练的此节中演示的方式在代码中进行配置。有关详细信息，请参见 中的“设置母版页范围”。

需要将 Home.aspx 页中的代码添加到想要重写默认母版页的每个页面上。