母版页可以多层嵌套使用~

①首先是“父”母版页,与一般的母版页差不多,除了一些固定的内容,页面中间留下大片的“空白”区域:
ExpandedBlockStart.gif ContractedBlock.gif <% dot.gif @ Master Language="C#" CodeFile="NestedMasterParent.master.cs" Inherits="NestedMasterParent_master"  %>
None.gif
None.gif
<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd" >
None.gif
None.gif
< html  xmlns ="http://www.w3.org/1999/xhtml"   >
None.gif
< head  runat ="server" >
None.gif    
< title > MasterPage可以多层嵌套使用 </ title >
None.gif
</ head >
None.gif
< body >
None.gif    
< form  id ="form1"  runat ="server" >
None.gif    
< table  border ="1"  cellpadding ="0"  cellspacing ="0"  width ="100%"  height ="100%" >
None.gif        
< tr >
None.gif            
< td  colspan ="2"  align ="center"  style ="background-color: mediumturquoise"   > MasterPage可以多层嵌套使用~~~ </ td >
None.gif        
</ tr >
None.gif        
< tr >
None.gif            
< td  valign ="top"  width ="150"  class ="nav"  style ="background-color: lightcyan" >
None.gif                
< table  border ="0"  width ="100%"  cellpadding ="4"  cellspacing ="0" >
None.gif                    
< tr >
None.gif                        
< td >< href ="#" > 超链接一 </ a ></ td >
None.gif                    
</ tr >
None.gif                    
< tr >
None.gif                        
< td >< href ="#" > 超链接二 </ a ></ td >
None.gif                    
</ tr >
None.gif                    
< tr >
None.gif                        
< td >< href ="#" > 超链接三 </ a ></ td >
None.gif                    
</ tr >
None.gif                    
< tr >
None.gif                        
< td >< href ="#" > 超链接四 </ a ></ td >
None.gif                    
</ tr >
None.gif                    
< tr >
None.gif                        
< td >< href ="#" > ………… </ a ></ td >
None.gif                    
</ tr >
None.gif                    
< tr >
None.gif                        
< td  style ="font-size: x-small; color: forestgreen; " > (上面这些链接都是假的,点了也没什么效果) </ td >
None.gif                    
</ tr >
None.gif                
</ table >
None.gif            
</ td >
None.gif            
< td  valign ="top"  align ="center" >
None.gif                
< asp:contentplaceholder  id ="ChildMaster"  runat ="server"   />
None.gif            
</ td >
None.gif        
</ tr >
None.gif        
< tr >
None.gif            
< td  colspan ="2"  align ="center"  style ="background-color: lightyellow"   >< href ="#"  onclick ="window.close();" > GoodBye </ a ></ td >
None.gif        
</ tr >
None.gif    
</ table >
None.gif    
</ form >
None.gif
</ body >
None.gif
</ html >
None.gif


②然后是“子”母版页,它填充了上面的母板页所留下的空白,同时,再次留下3块“空白”的区域:
ExpandedBlockStart.gif ContractedBlock.gif <% dot.gif @ Master Language="C#" masterpagefile="~/NestedMasterParent.master" CodeFile="NestedMasterChild.master.cs" Inherits="NestedMasterChild_master"  %>
None.gif
None.gif
< asp:content  id ="ChildMaster"  contentplaceholderid ="ChildMaster"  runat ="Server" >
None.gif
< table  border ="1"  cellpadding ="10"  cellspacing ="0"  width ="100%"  height ="100%" >
None.gif    
< tr >
None.gif        
< td  align ="left"  colspan ="2"  style ="font-style: italic;" > “子”母版页:
None.gif        
</ td >
None.gif    
</ tr >
None.gif    
< tr >
None.gif        
< td  align ="left"  colspan ="2"   >
None.gif            
< asp:contentplaceholder  id ="ContentTitle"  runat ="Server"   />
None.gif        
</ td >
None.gif    
</ tr >
None.gif    
< tr >
None.gif        
< td  align ="left"  valign ="top"   >
None.gif            
< asp:contentplaceholder  id ="ContentText"  runat ="Server"   />
None.gif        
</ td >
None.gif        
< td  align ="left"  width ="150"  valign ="top"   >
None.gif            
< asp:contentplaceholder  id ="ContentNav"  runat ="Server"   />
None.gif        
</ td >
None.gif    
</ tr >
None.gif
</ table >
None.gif
</ asp:content >

稍稍遗憾的是,上面的HTML只能手写,因为不但我们在添加一个新母版页时无法勾选“选择母版页”,并且还无法切换到设计视图:
childMaster.JPG

③最后是使用母版页的Page:
ExpandedBlockStart.gif ContractedBlock.gif <% dot.gif @ Page Language="C#" masterpagefile="~/NestedMasterChild.master" CodeFile="NestedMaster.aspx.cs" Inherits="NestedMaster_aspx" Title="Nested Master Pages"  %>
None.gif
None.gif
< asp:content  id ="ContentTitle"  contentplaceholderid ="ContentTitle"  runat ="Server" >
None.gif
< h1 > 区域A:Content Title </ h1 >
None.gif
</ asp:content >
None.gif
None.gif
< asp:content  id ="ContentText"  contentplaceholderid ="ContentText"  runat ="Server" >
None.gif
< p > 区域B </ p >
None.gif
</ asp:content >
None.gif
None.gif
< asp:content  id ="ContentNav"  contentplaceholderid ="ContentNav"  runat ="Server" >
None.gif
< p > 区域C </ p >
None.gif
</ asp:content >

同样遗憾的是,设计上面的页面时也无法切换到设计视图。

在页面中的各个区域里设计好适当的内容后,运行起来,可以得到下面的效果:
MasterPage.JPG


这时候我们也许会有一个疑问:为什么要用多层嵌套的母版页?象上面的例子,一开始就在页面上
留下3块区域不是更方便吗?
大概应该这样考虑:站点可能使用一个统一的母版页所为主框架,然后在一片较大的区域中,某一些情况需要分成3块的样式,某一些则会是4块,也许还会有更复杂的要求,这时候多层嵌套就有用了。
但是问题又来了:设计起来这么不方便,该如何使用呢?

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值