第六章主题与母版页
合集下载
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
4. 整个网站引用主题 在Web.config文件中,修改如下节点：
<pages styleSheetTheme=“主题名称”> 或者： <pages Theme=“主题名称”>
5. 动态加载指定主题
在页面中可以动态加载主题，通常是 在页面的PreInit()事件处理程序中，通过Page 对象的Theቤተ መጻሕፍቲ ባይዱe属性来设置。如：
Sub Page_PreInit(Sender As Object, E As EventArgs) Page.Theme = Request("selectedTheme") If Page.Theme Is Nothing Then ' 没有指定主题 Page.Theme = “FirstTheme" End If Label2.SkinId = "BlueLabel“ End Sub
6. 禁用主题
通常如果使用Theme属性，主题将重写页和控件的本地设置。当页或 控件已经有预定义的外观，而又不希望主题重写它时，禁用主题将十分有 用。 当然。使用StyleSheetTheme属性应用主题的话，主题只是设置没有 本地设置的属性，而有本地设置的属性则会优先于主题显示，可以起到禁 用的作用。 若要显式地禁用页的主题，可以将@Page指令的EnableTheming属性 设置为False即可，如下： <%@ Page EnableTheming=“false”%> 若要显式地禁用控件的主题，可以将控件的EnableTheming属性设置 为False即可，如下： <asp:Label id=“Label1”runat=“server”EnableTheming=“false”>
外观Skin：外观文件具有文件扩展名 .skin，它 包含各个服务器控件的属性设置。一个外观文件可以 包含一个或多个控件类型的一个或多个控件外观。 控件外观类型分为：“默认外观”和“已命名外 观”。 在.skin文件的控件中，如果控件外观没有设置 SkinID 属性，则是默认外观。已命名外观是设置了 SkinID 属性的控件外观。
在web应用程序的功能方面主要包括站点的结构控件的行为数据库设计保护应用程序安全的代码当用户单击按钮时产生什么事考虑外观可以使得站点更加美观一些包括颜色图象的使用页面的布局在某种程度上也包括呈现给浏览器的代码的样式
第六章 主题和母版技术
学习要点：
• 概述
• 主题与外观 • 母版页
6.1 概述
开发任何web程序的过程通常需要考虑两个主要 方面：功能和外观。在Web应用程序的功能方面，主 要包括站点的结构、控件的行为、数据库设计、保护 应用程序安全的代码、当用户单击按钮时产生什么事 件等。 考虑外观可以使得站点更加美观一些，包括颜色、 图象的使用，页面的布局，在某种程度上也包括呈 现给浏览器的代码的样式。 一个成功的应用程序在这两个方面之间能够达 到一个平衡，为用户提供容易使用并且看起来美观 的站点，很多失败的站点就是因为没有在这两者之 间达到平衡。
6.2 主题与外观
1.主题与外观概述
主题Theme：主题是属性设置的集合，使用这些 设置可以定义页面的样式(.css)和控件的外观，可以 对页或网站应用主题，或对全局应用主题。 在网站级设置主题会对站点上的所有页和控件应 用样式和外观。在页面级设置主题会对该页及其所有 控件应用样式和外观。 通常主题是由一组元素组成的，其中包括外观 （Skin）、级联样式表（CSS）、图像和其他资源。 主题将至少包含外观。
2.创建内容页
选中网站项目，执行快捷菜单中的“添加新项” → “Web窗体”，并且勾选“选择母版页”复选框，单击“确定” 后在弹出的“选择母版页”对话框中选择要引用的母版页即可。 在内容页的@Page命令中通过MasterPageFile属性指定 套用的母版页文件。Title属性是网页标题文字，也就是指定 母版页HtmlHead标记的标题文字，如：
<%@ Page MasterPageFile=“母版页文件名.master” Title=“内容页标题”%>
在内容页中，通过Content控件为母版页的 ContentPlaceHolder控件提供内容。并且在内容页中只有一个 Content控件可以为母版页的一个ContentPlaceHolder控件提 供内容。 Content控件通过ContentPlaceHolderID属性,与套用的母 版页的ContentPlaceHolder控件的ID属性相对应。如：
<asp:Content ContentPlaceHolderID=“menu” Runat=“server”/>
注意：由于母版页中已经有<html>、<head>、<form>等标 记，所以内容页就不需要重复这些标记。
当向页应用主题时，默认外观自动应用于同一类型 的所有控件，例如为Button控件创建一个默认外观，则 该控件外观适用于使用本主题的页面上的所有Button控 件（默认外观严格按控件的类型来匹配，因此Button控 件外观适用于所有Button控件，但不适用于LinkButton 等控件）。 已命名外观不会自动按类型应用于控件，而应当通 过设置页面控件的SkinID属性将已命名外观显式应用于 控件。通过创建已命名外观，可以为应用程序中同一类 型控件的不同实例设置不同的外观。
母版页网页内容的另一部分则是容纳内容页所提供 的内容，该部分是通过ContentPlaceHolder控件定义可编 辑区域的。母版页中可以有0到多个ContentPlaceHolder 控件。如：
<asp:ContentPlaceHolder Id=“menu” Runat=“server”/>
上述标记建立名为menu的ContentPlaceHolder控件， Id属性是用来对应内容页的Content控件的 ContentPlaceHolderID 属性的。
6.3 母版页
使用 母版页可以为同一系列的网 页创建一致的布局。在这种技术中，网页被分成 两类：描述一致外观的网页被称为母版页，引用 母版页的网页称作内容页。 单个母版页可以为应用程序中的所有页（或 一组页）定义所需的外观和标准行为。然后可 以创建包含要显示内容的各个内容页。 当用户请求内容页时，这些内容页与母版页 合并以将母版页的布局与内容页的内容组合在 一起输出,以此简化页面布局排版。
2.建立主题的步骤： 1>、在Web应用程序的根目录中，建立名 为App_Themes的目录。 2>、在App_Themes目录中创建用户自己 命名的各个主题名称的子目录。 3>、将.skin文件、CSS文件和图片等都 放置于此目录，就完成了主题的建立。
3.单个页面引用主题 使用页面的Theme或StyleSheetTheme属性 引用外观文件。 使用Theme引用外观样式，其优先级最高， 即它可以覆盖控件本身的样式设置。 使用StyleSheetTheme引用外观样式， 其优先级最低，即控件本身的样式设置可以 覆盖外观样式设置。格式如下： <%@ Page Theme=“主题名称”%> <%@ Page StyleSheetTheme=“主题名称”%>
1.创建母版页
选中网站项目，执行快捷菜单中的“添加新项”
→ “母版页”即可。
母版文件的扩展名是.master。母版页就如同aspx页 面一样，但它是通过@Master指令来识别的，所以母版页 中用@ Master替换了普通aspx页面的@Page。 母版页网页内容的描述可以分为两部分：一部分是描 述共享的外观，该部分所使用的标记和控件仍然是一般网 页所使用的标记和控件，如：<html>、<body>、<form>等 等。