文本阅读编辑(母版页的应用)

母版页,实质为完整的.aspx的Web窗体,再窗体中含有几个占位控件。在调用的母版页的子页中,我们可以编辑占位控件的内容,编辑完成后将两个页面进行合并(由IIS完成):

文本阅读编辑(母版页的应用)

合并效果:

文本阅读编辑(母版页的应用)

母版页中有Holder_3,但是在子页中没有编辑,,因此合并后最终没有Holder_3控件;

母版页中的普通内容(控件或标签)在合并后不发生改变;


IIS在工作过程中,不会调用母版页,只会调用子页名,但是在调用子页名时,会自动调用母版页;

IIs首先编译子页,然后编译相关母版页并将子页嵌入母版页之中形成合并页面,并将合并完的页面发回浏览器;

文本阅读编辑(母版页的应用)



金黄色为母版页的层,全部在母版页中进行编辑,红色为母版页为子页提供的占位控件(在子页中进行编辑);

文本阅读编辑(母版页的应用)


创建母版页:

母版页扩展名为.master,页面结构中多几个控件标签:

文本阅读编辑(母版页的应用)


文本阅读编辑(母版页的应用)

注意蓝色区域(占位控件)的作用,子页中在head中会定义一些Css,JavaScript等相关的内容,这些内容定义后会被嵌套在蓝色区域的位置;

在body主体中的占位控件,这个标签之间用于包含在子页中编辑的内容;


接下来为母版页创建一个子页:

选择Web窗体:

文本阅读编辑(母版页的应用)

注意勾选复选框:

文本阅读编辑(母版页的应用)

点击添加按钮后,弹出对话框,让你选择添加的母版页:

文本阅读编辑(母版页的应用)

选择目标母版页,点击确定即可;

新建立的子页中有两个content标签:

文本阅读编辑(母版页的应用)

注意母版页与子页名字要对应:

母版页:

文本阅读编辑(母版页的应用)

文本阅读编辑(母版页的应用)

新建的子页:

文本阅读编辑(母版页的应用)

母版页的内容我们无法在子页中直接编辑;

注意,我们在母版页中加入<p>第一行</p>标签,在子页中加入如下内容:

文本阅读编辑(母版页的应用)

运行效果:

文本阅读编辑(母版页的应用)

子页源文件:

注意:

此时运行页面的地址为:文本阅读编辑(母版页的应用)

源代码的地址为:文本阅读编辑(母版页的应用)

两个地址均为子页面的地址,看不到模板页被调用;

发现子页中的内容被嵌套在蓝色区域,母版页中的内容也被显示,且看不到母版页被调用的痕迹:

下列为运行页面的源代码:

文本阅读编辑(母版页的应用)

 


新的布局:

首先在母版页中进行布局:

文本阅读编辑(母版页的应用)文本阅读编辑(母版页的应用)

此时,页面的布局:

文本阅读编辑(母版页的应用)

通过Css对页面进行控制:

文本阅读编辑(母版页的应用)

文本阅读编辑(母版页的应用)文本阅读编辑(母版页的应用)


注意:要对clr进行样式控制,否则运行效果会出现问题;

文本阅读编辑(母版页的应用)


为了使main中的左右浮动不对下面产生影响,添加清除浮动层:

文本阅读编辑(母版页的应用)

文本阅读编辑(母版页的应用)


更正一下ID:

文本阅读编辑(母版页的应用)

运行效果:

文本阅读编辑(母版页的应用)

接下来晚上母版页:

文本阅读编辑(母版页的应用)文本阅读编辑(母版页的应用)文本阅读编辑(母版页的应用)

预览效果:

文本阅读编辑(母版页的应用)

点线点到了元素上面,要改正;