背景：回顾下以前用到过的asp.net控件

介绍：

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

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

原理：

　　母版页主要是由母版页本身（.master文件）和一个或多个内容页组成。

　　母版页包括一个或多个 <asp:ContentPlaceHolder ID="TestContentPlaceHolder" runat="server"/> 控件，在内容页中可以定义要替换的内容。

　　容页中通过添加 Content 控件并将这些控件映射到母版页上的 ContentPlaceHolder控件来创建内容。

示例代码：

代码

<%@ 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>

<%@ 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%;  padding: 0px; line-height: 1.8; color: rgb(0, 0, 255);">>

        <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>

<%@ 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 母版页的更多相关文章

  1. ASP.NET母版页

    ASP.NET母版页:主要是设置一致界面的页面,在固定的页中进行更新. 如图1-1所示 页头 页中(页内容) 页尾 图1-1  母版页 一般网页是固定页头和页尾,只更新页内容,来实现网页的跳转或内容的 ...

  2. ASP.NET母版页与内容页相对路径的问题

    1. 图片问题 图片显示问题:<img runat="server" src="~/images/ad468x60.gif" alt="&quo ...

  3. asp.net 母版页使用详解--转

    http://www.cnblogs.com/_zjl/archive/2011/06/12/2078992.html 母版页是VS2005中新引入的一个概念,它很好地实现界面设计的模块化,并且实现实 ...

  4. asp.net 母版页使用详解

    母版页是VS2005中新引入的一个概念,它很好地实现界面设计的模块化,并且实现实现了代码的重用.它就像婚纱影楼中的婚纱模板,同一个婚纱模板可以给不同的新人用,只要把他们的照片贴在已有的婚纱模板就可以形 ...

  5. [转]ASP.NET母版页中对控件ID的处理

    一.问题提出 由于总体排版和设计的需要,我们往往创建母版页来实现整个网站的统一性,最近我由于统一性的需要,把原来整个项目单独的页面全部套用了母版页.但是出现了一个错误……在我的Blog中记录一下,方便 ...

  6. VS2012 ASP.NET 母版页的创建与使用

    在做牛腩新闻公布系统的过程中,须要使用ASP.NET的母版页来抽出全部网页的公共部分,以便更好的复用自己的网页布局和设计. 首先我们来看怎样创建一个新的母版页,例如以下图所看到的: 加入之后,例如以下 ...

  7. ASP.NET 母版页和内容页的加载顺序

    Master 模板页Content 内容页如果希望Master页面的数据传给Content页面,请Init如果希望Content页面的数据传给Master页面,请重载Load具体细节不多说了,看下面页 ...

  8. 【转】asp使用母版页时内容页如何使用css和javascript

    源地址:https://www.cnblogs.com/accumulater/p/6767138.html

  9. Asp.Net页面(母版页)加载顺序

    ASP.NET 母版页和内容页中的事件 母版页和内容页都可以包含控件的事件处理程序.对于控件而言,事件是在本地处理的,即内容页中的控件在内容页中引发事件,母版页中的控件在母版页中引发事件.控件事件不会 ...

随机推荐

  1. Agri-Net

    poj1258:http://poj.org/problem?id=1258 题意:生成树的模板题.简单题. #include<iostream> #include<cstring& ...

  2. int 和String之间的互转

    int -> String int i=12345;String s="";第一种方法:s=i+"";第二种方法:s=String.valueOf(i); ...

  3. Delphi下的RTTI函数大全

    http://ljz9425.blog.163.com/blog/static/369148572008111635253858/ Delphi下的RTTI(下) 2008-12-16 15:52:5 ...

  4. 一句话改变TGraphicControl控件的left坐标的前世今生

    稍微用脑子想了一下,图形控件没有句柄,因此先把自己的坐标改一改,然后只要把父控件的某些区域Invalidate一下就可以了,WM_PAINT消息一来,父控件就会重绘所有子图形控件,就达到了相应的效果. ...

  5. 浅谈RDD

    RDD(Resilient Distributed Datasets)弹性分布式数据集,是在集群应用中分享数据的一种高效,通用,容错的抽象,是Spark提供的最重要的抽象的概念, 它是一种有容错机制 ...

  6. Oracle索引扫描算法

    SQL> create table t as select * from dba_objects; Table created. SQL> create index idx_t on t( ...

  7. Shader Forge 植物摆动

    前日才赞Shader Forge好用,今天就找到了BUG(1.03 版本) -- 获得顶点在物体空间坐标的方法绕来绕去,transform不支持齐次坐标, 不超过3行的shader代码要我出这么一个宏 ...

  8. SPJ

    1. ∏sno(δjno='j1'(spj))2. ∏sno(δpno='p1'(δjno='j1'(spj)))3. ∏sno(δjno='j1'(spj)∞δcolor='红'(p))4. ∏jn ...

  9. HDU1510 White rectangles

    White Rectangles Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) ...

  10. python 代码格式化工具：autopep8

    学习资料: https://github.com/hhatto/autopep8 背景 autopep8 会根据 PEP 8 样式文档来格式化 python 代码.它使用 pep8 来决定代码的哪部分 ...