.NET ASP.NET丶MasterPage（母版）

梳碧湖-砍柴人

于 2019-10-22 17:31:29 发布

阅读量464

点赞数

文章标签： .NET ASP.NET丶MasterPage（母版）

本文链接：https://blog.csdn.net/weixin_44870681/article/details/102686714

版权

一丶母版（MasterPage）

介绍：

使用 ASP.NET 母版页可以为应用程序中的页创建一致的布局。单个母版页可以为应用程序中的所有页（或一组页）定义所需的外观和标准行为。然后可以创建包含要显示的内容的各个内容页。当用户请求内容页时，这些内容页与母版页合并以将母版页的布局与内容页的内容组合在一起输出。

母版页为具有扩展名 .master的asp.net文件。

原理：

母版页主要是由母版页本身（.master文件）和一个或多个内容页组成。
母版页包括一个或多个 <asp:ContentPlaceHolder ID=“TestContentPlaceHolder” runat=“server”/> 控件，在内容页中可以定义要替换的内容。
容页中通过添加 Content 控件并将这些控件映射到母版页上的 ContentPlaceHolder控件来创建内容。

什么是母版：

（1）：网站的布局通常是统一的，上面是Logo、菜单条、下面是公司地址、版权声明等。如果每个页面都重复做这些功能的话：重复性劳动、一旦修改那么每个页面都要修改。可以使用Iframe(内嵌框架)，FrameSet（框架集）技术来解决，但是FrameSet技术不灵活，而且很难进行SEO，所以只有部分内网系统还在用FrameSet，.Net中一般用母版（MasterPage）技术来解决这个问题。
（2）：MasterPage是这样一种技术，把页面布局画好，在变化的内容部分“留空”，留空的部分由子页面填充内容，这样子页面只要填空就行，不用重复设计页面结构，一旦要修改页面结构修改母版页就可以，这样所有页面都会变化。母版页“挖坑”，具体页面“填坑”。母版页、具体页面中几乎可以使用所有的普通WebForm页面能够使用的技术。
（3）：添加一个“母版页”，使用asp:ContentPlaceHolder挖坑，新建的母版页已经自动设置了两个ContentPlaceHolder，还可以添加更多的ContentPlaceHolder。在id="head"前面后面都加入一些script，在id="ContentPlaceHolder1"前后也加入一些内容。
（4）：创建使用母版页的具体页面，WebSite是新建“Web窗体”的时候勾选“选择模板页”，WebApplication是新建“Web内容窗体”，然后选择页面使用的母版页（一个项目内可以创建多个母版页，比如新闻频道用一个母版页，视频频道用另外一个母版页）。
（5）：使用母版的具体页面和普通aspx页面的不同是：@Page区域用MasterPageFile属性表示页面使用哪个母版页，页面不包含html等内容，只定义了<asp:Content这些填坑的内容。asp:Content就是用来在具体页面中对母版页进行填坑的，ContentPlaceHolderID为这个Content要填母版页中的哪个坑，对应母版页中ContentPlaceHolder的Id
（6）：具体页面可以对母版页填坑也可以不填坑，如果不填坑则显示asp:ContentPlaceHolder中定义的默认内容。
（7）：案例：实现上导航菜单、下版权声明，左侧功能面板，右侧为具体的内容的模板，然后分别实现关于我们和登录界面。
（8）:在母版页中使用超链接、图片地址等的时候需要注意路径问题，在母版页中的runat=server控件的链接地址、图片地址等会被解析为相对于母版页的地址，而客户端HTML控件ASP.Net引擎是直接输出的，因此是解析为相对于具体页面的地址。建议使用服务端控件，如果不能使用服务器控件，那么可以在aspx页面中调用ResolveClientUrl 、ResolveUrl进行虚拟路径的转换
（9）:每个具体页设置不同的标题，只要在具体页面的@page中设置Title属性即可。可以在具体页中通过Master.FindControl来定位母版页中的控件然后对母版页中的控件进行操作，比如在一个具体页面中将母版页中的一个控件隐藏。

实例：

<%@ Page Title="" Language="C#" MasterPageFile="~/TestMain.Master" AutoEventWireup="true" CodeBehind="AnotherTestPage.aspx.cs" Inherits="Maticsoft.Web.AnotherTestPage" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TestContentPlaceHolder" runat="server">
    <div style=" width:100%; height:100%; background-color:#666666">
        <div style=" margin:10px 0 0 10px">
            <h4>
                这里是另一个内容页(AnotherTestPage.aspx)
            </h4>
            <p style=" font-size:12px; font-family:宋体">
                    &nbsp;&nbsp;&nbsp;&nbsp;Master Page 使您有能力为 web 应用程序中的所有页面（或页面组）创建一致的外观和行为。
                Master Page 为其他页面提供了模版，带有共享的布局和功能。Master Page 为内容定义了可被内容页面覆盖的占位符。而输出结果就是 Master Page 和内容页面的组合。<br />
                    &nbsp;&nbsp;&nbsp;&nbsp;内容页包含您希望显示的内容。
                当用户请求内容页时，ASP.NET 会对页面进行合并以生成输出，输出结果对 Master Page 的布局和内容页面的内容进行了合并。
            </p>
        </div>
    </div>
</asp:Content>

母版页代码：

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="TestMain.master.cs" Inherits="Maticsoft.Web.TestMain" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
    
    <style type="text/css">
        #main
        {
            width:800px;
            height:600px;
            background-color:#aaa;
        }
        #head
        {
            width:100%;
            height:100px;
            background-color:#c1c1e5;
        }
        #content
        {
            width:100%;
            height:500px;
        }
        #left
        {
            width:150px;
            height:100%;
            float:left;
        }
        #center
        {
            width:650px;
            height:100%;
            float:left;
        }
        a
        {
            text-decoration:none;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div id="main">
        <div id="head">
            <h1 style="margin:10px 0 0 10px">母版页测试</h1>
        </div>
        <div id="content">
            <div id="left">
                <h3 style=" margin:10px 0 0 10px">左侧导航</h3>
                <div style=" margin-left:20px; font-size:18px; font-family:Verdana">
                    <a href="TestPage.aspx">asp.net</a><br />
                    <a href="AnotherTestPage.aspx">CSS</a><br />
                    <a href="#">HTML</a><br />
                    <a href="#">JQuery</a>
                </div>
            </div>
            <div id="center">
                <asp:ContentPlaceHolder ID="TestContentPlaceHolder" runat="server">
                </asp:ContentPlaceHolder>
            </div>
        </div>
    </div>
    </form>
</body>
</html>

二.使用母版页的优点：

母版页提供了开发人员已通过传统方式创建的功能，这些传统方式包括重复复制现有代码、文本和控件元素；使用框架集；对通用元素使用包含文件；使用 ASP.NET 用户控件等。母版页具有下面的优点：

使用母版页可以集中处理页的通用功能，以便可以只在一个位置上进行更新。
使用母版页可以方便地创建一组控件和代码，并将结果应用于一组页。例如，可以在母版页上使用控件来创建一个应用于所有页的菜单。
通过允许控制占位符控件的呈现方式，母版页使您可以在细节上控制最终页的布局。
母版页提供一个对象模型，使用该对象模型可以从各个内容页自定义母版页。

三.母版页运行时行为：

在运行时，母版页是按照下面的步骤处理的：

用户通过键入内容页的 URL 来请求某页。
获取该页后，读取 @ Page 指令。如果该指令引用一个母版页，则也读取该母版页。如果这是第一次请求这两个页，则两个页都要进行编译。
包含更新的内容的母版页合并到内容页的控件树中。
各个 Content 控件的内容合并到母版页中相应的 ContentPlaceHolder 控件中。
浏览器中呈现得到的合并页。
注：母版页成为了内容页的一部分。实际上，母版页与用户控件的作用方式大致相同 – 作为内容页的一个子级并作为该页中的一个容器。但是在这种情况下，母版页是所有呈现到浏览器中的服务器控件的容器。

四.限定母版页的范围

可以在三种级别上将内容页附加到母版页：

（1）页级 可以在每个内容页中使用页指令来将内容页绑定到一个母版页，如下面的代码示例中所示。

<%@ Page Language="C#" MasterPageFile="MySite.Master" %>

（2）应用程序级 通过在应用程序的配置文件 (Web.config) 的 pages 元素中进行设置，可以指定应用程序中的所有 ASP.NET 页（.aspx 文件）都自动绑定到一个母版页。该元素可能看起来类似于下面这样。

<pages masterPageFile="MySite.Master" />

如果使用此策略，则应用程序中的所有具有 Content 控件的 ASP.NET 页都与指定的母版页合并。（如果某个 ASP.NET 页不包含 Content 控件，则不应用该母版页。）
（3）文件夹级 此策略类似于应用程序级的绑定，不同的是只需在一个文件夹中的一个 Web.config 文件中进行设置。然后母版页绑定会应用于该文件夹中的 ASP.NET 页。

梳碧湖-砍柴人

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
.NET ASP.NET丶MasterPage（母版）

一丶母版（MasterPage）介绍：使用 ASP.NET 母版页可以为应用程序中的页创建一致的布局。单个母版页可以为应用程序中的所有页（或一组页）定义所需的外观和标准行为。然后可以创建包含要显示的内容的各个内容页。当用户请求内容页时，这些内容页与母版页合并以将母版页的布局与内容页的内容组合在一起输出。母版页为具有扩展名 .master的asp.net文件。原理：母版页主要是由母版页本...
复制链接

扫一扫