ASP.NET 2.0 中的母版页 (第一部分)

• 下载演示项目 - 3.89 Kb

引言

如果您是一名 Microsoft Web 开发人员，我敢打赌，您一定不止一次地发现自己正在寻找一个现成的框架，该框架允许您创建模板来维护网站中一致的外观和感觉以及轻松的导航，或者您已经开发了一些可以自己完成此操作的东西。本文向 Web 开发人员介绍 ASP.NET 2.0 中一项名为“母版页”的新功能，它提供了一种标准化的方法将模板集成到您的网站中，这样您就不必重新发明轮子了。

背景

通常在过去，如果我们这些 Microsoft Web 开发人员需要开发一个具有一致外观和感觉以及页面内容不断变化的网络站点，我们会采用不同的技术来实现接近模板驱动的解决方案。Classic ASP 开发人员会使用服务器端包含（Server Side Includes），ASP.NET 1.1 开发人员会使用用户控件（User Controls），而 Web 设计师会使用第三方解决方案，如 Macromedia Dreamweaver 的模板功能，这是一个客户端解决方案，涉及到使用一个工具来更新使用特定模板的所有 HTML 文件，当模板更新时。

借助 ASP.NET 2.0 和 Visual Studio .NET 2005 中的“母版页”，Microsoft 提供了一种开箱即用的标准化方法来实现相同的结果，同时还能享受与 Visual Studio .NET IDE 的完全集成和所见即所得的开发！在本文中，我们将深入探讨母版页，并通过一个“Hello World”项目来介绍母版页！

接下来的文章将描述其他代码概念，例如从母版页公开属性，这允许从内容页修改母版页控件，以及使用主题，但现在让我们先从母版页基础开始！

开始使用母版页

开始使用 ASP.NET 母版页的第一步是在您的 Visual Studio .NET 2005 IDE 中创建一个“空白网站”。创建空白项目后，右键单击项目并添加一个新项。在您可以创建的项目类型列表中，选择“母版页”来创建一个新的母版页。以下屏幕截图说明了这一点。

母版页（扩展名为“.master”的文件）是为内容页提供“结构”的模板。一个可以用来描述母版页的典型场景是，网站的左侧导航页和顶部部分对于所有页面都保持不变，而内容部分会根据用户点击的链接而变化。在此示例中，顶部面板和左侧面板通常会在母版页中实现。保持从链接到链接变化的部分将在母版页中实现为一个内容占位符控件。以下屏幕截图说明了我创建的一个简单的母版页设计，其中网站的页眉和导航面板将对整个站点保持固定，但内容将从页面到页面变化。

另外需要注意的是，Visual Studio 会自动创建一个内容占位符控件，该控件允许您为该内容区域定义默认内容。如果使用此模板的“内容页”未为此区域提供任何内容，则此功能非常有用。换句话说，如果使用此模板的内容页未覆盖内容，则将使用此内容。

一旦我在母版页中布局了基本站点设计，并决定哪些部分是模板的一部分，哪些部分会从页面到页面变化，我就会继续开始定义我的内容页。要为母版页添加内容页，只需右键单击母版页并单击“添加内容页”。添加新内容页后，会为我创建一个新的“aspx”文件。如前所述，使用母版页的一个优点是它能与 Visual Studio IDE 无缝集成。本质上，我获得的一个优势是，在编辑内容页时，我仍然可以看到我网站的“全貌”，但我不允许修改属于模板的部分。如下面的屏幕截图所示，在开发我的内容页时，我仍然可以看到从母版页提取的部分（顶部和左侧面板），但这些部分是灰色的，并且在处理内容页时不允许我修改它们！

我们遵循相同的步骤，基于母版页创建另一个内容页。使用上述相同过程为“其他链接”页面（在附带的项目中，我将其命名为 MyLinks.aspx）创建内容页后，我们会修改母版页以更新导航面板的超链接。在接下来的屏幕截图中，我只是使用一个 <a> </a> 标签指向我新创建的内容页来更新我的母版页。将“Home”链接指向我创建的第一个内容页（Default.aspx），而“Links”现在指向 MyLinks.aspx。下面的屏幕截图说明了对母版页所做的更改；基本上，导航面板上的两个静态文本片段现在都已超链接到内容页。

完成此操作并保存更改后，这些更改将立即反映在我的内容页上！如下面的屏幕截图所示，我正在修改 Default.aspx（这是一个内容页），但对母版页或模板所做的所有更改都会自动反映在内容页中！

深入了解

查看 Visual Studio 如何为母版页生成代码通常有助于更好地理解母版页的工作原理。其中大部分将在本文的第二部分介绍，该部分将深入探讨母版页的高级概念，但这里有一些基本概念。

创建母版页时，Visual Studio 会自动为母版页插入一个内容占位符。作为内容占位符的“默认内容”，母版页的源代码将被修改并内联生成新代码。以下代码片段对此进行了说明。

<asp:contentplaceholder id="ContentPlaceHolder1" runat="server">
  <span style="font-size: 10pt; font-family: Tahoma">This is the default content. 
      It shows up when there is no content to override this content.</span>
</asp:contentplaceholder>

另一方面，内容文件仅负责提供内容和引用母版页。这样，就维护了哪个内容页使用哪个母版页进行布局之间的链接。以下代码片段对此进行了说明。

<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" 
         AutoEventWireup="true" CodeFile="Default.aspx.cs" 
         Inherits="_Default" Title="Untitled Page" %>
<asp:Content ID="Content1" 
     ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
 <span style="font-size: 10pt; font-family: Tahoma">
       This is the content of my first Page!!!</span>
</asp:Content>

在上面的代码片段中，Page 的 MasterPageFile 属性告诉 .NET 此内容页正在使用哪个母版页。需要注意的是，当用户访问网站时，他们实际上将导航到内容页（aspx 文件）。因此，从更广泛的角度来看，aspx 文件或内容页实际上负责从母版页提取代码，渲染母版页 HTML 的布局，然后将内容 HTML 合并到正确的位置。这个概念需要一些时间来适应，但在调试内容页问题时特别有用。

关注点

这是我们过去一直在使用定制技术完成的事情，但拥有一个“Microsoft 认证”的开箱即用解决方案来解决 Web 开发人员几乎每天都会遇到的这个问题，这真是令人兴奋！

历史

初稿。欢迎将所有评论/建议发送至 rajivpopat@hotmail.com。