7.1母版页

7.1　母版页

母版页的作用相当于网站的模板，在母版页基础上编写的页面被称作内容页，母版页和内容页共同构成了有着统一风格的网站系统。本节介绍母版页和内容页的相关概念和应用。

7.1.1　母版页概述

母版页能够将页面上的公共元素（如系统网站的Logo、导航条和广告条等）整合到一起用来创建一个通用的外观，它的优点如下。

（1）有利于站点修改和维护，降低开发人员的工作强度。

（2）提供高校的内容整合能力。

（3）有利于实现页面布局。

（4）提供一种便于利用的对象模型。

母版页以“.master”作为后缀名，是master文件。母版页的页面与一般的Web窗体非常相似，可以添加HTML元素和服务器端控件，其内容的编辑与一般的Web页面一样。

风格一样的页面，也有着相同的部分和不同的部分。母版页是将网站中页面的相同部分定义下来，并指定一个区域供内容页编写其特有内容。

在母版页中，为内容页预留的区域使用ContentPlaceHolder控件占据着，一个母版页中可以预留一个或多个ContentPlaceHolder。

由于母版页与一般的Web页面相似，因此可通过它们之间的区别，来分析母版页的特点，如下所示。

（1）母版页使用@Master指令，而Web窗体页使用@Page指令。

（2）母版页可以使用一个或多个ContentPlaceHolder控件，用来占据一定的空间，而Web窗体页则不允许使用ContentPlaceHolder控件。

（3）母版页派生自MasterPage类，而Web窗体页派生自Page类。

（4）母版页后缀名是.master，普通页面后缀名为.aspx。

（5）母版页仅作为网站设计时的中介文件，而Web窗体页是可直接在浏览器中显示的文件。

在介绍母版页的创建之前，首先了解一下当前网站的常见布局方式。母版页是作为网页的一部分被呈现，而母版区域的划分有着多种布局形式，常见布局如下。

（1）栏式结构布局。栏式结构是很常见的一种结构，它简单实用、条理分明并且格局清晰严谨，适合信息量大的页面。常见的几种栏式布局如图7-1所示。

图7-1　常见的栏式布局

（2）区域结构布局。区域结构的特点是页面精美、主题突出以及空间感很强。但是它适合信息量比较少的页面，并且在国内使用的比较少。区域机构可以将页面分隔成若干个区域，如图7-2所示。

图7-2　区域结构示例

如图7-1和图7-2所示，母版页区域常用在页面的上部、左侧或同时用于上部和左侧。母版页的创建需要在项目下添加新建项，与站点地图的添加步骤一样，如图7-3所示。

图7-3　添加母版页

7.1.2　添加内容页

内容页与一般的Web页面一样，是aspx文件。其添加方式与一般的Web页面一样，只是在添加窗口中需要选择【使用母版页的Web窗体】选项，打开【选择母版页】对话框，如图7-4所示。选择需要的母版页，单击【确定】按钮完成创建。

图7-4　选择母版页

内容页的创建有多种方式，上述创建是其中一种。如在母版页中直接创建内容页，可在母版页中右击，选择【添加内容页】命令即可添加该母版页的内容页。添加完成之后，内容页中代码如下所示。

    <%@  Page  Title=""  Language="C#"  MasterPageFile="～/SiteHead.Master" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>
    <asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    </asp:Content>
    <asp:Content  ID="Content2"  ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    </asp:Content>

代码的首行MasterPageFile="～/SiteHead.Master"语句定义了该内容页所归属的母版页，后面的两个Content控件对应母版页中的两个ContentPlaceHolder控件，控件在页面中所占据的位置可参考对应的母版页。

除了直接创建内容页，还可将现有的非内容页改为内容页，步骤如下。

（1）页面代码中添加MasterPageFile="母版页地址"语句，指定所归属的母版页。

（2）删除页面中Content控件区域以外的标记，即页面中的所有标记都放在Content控件内部，并删除＜html＞、＜head＞和＜body＞标记。这些页面标记是Web页面所需要的，但内容页需要嵌套在母版页中，因此不需要这些标记。