当前位置:文档之家› 第8章 ASP.NET中的样式,主题和母版页

第8章 ASP.NET中的样式,主题和母版页


8.4
小结
本章介绍了中的外观处理技术,首先讨论了 CSS,演示了在VS2010中如何创建CSS,如何向 页面应用CSS。接下来讨论了中的主题,主题可以 为中的服务器控件提供一致的外观,并可以方便的 切换主题,本章讨论了创建皮肤文件,使用命名皮肤处理多 个皮肤的冲突,在web.config配置文件中,为整个网站应用 主题以及如何动态的切换主题。 母版页类似于Word中的模板,本章讨论了如何创建母版 页,定义母版页的默认内容,如何处理母版页的相对路径, 动态加载母版页以及母版页的多级嵌套技术。
创建样式
在中,可以创建三种类型的样式: 1.内联样式 2.内部样式表 3.外部样式表
8.1.2
应用样式
现在己经创建好了CSS样式表文件,并定义了CSS 样式规则。下面来为Web页面应用样式。VS2010中提供 了一些非常实用的工具,用来非常精细的控制和修改 CSS样式。
8.2
主题
读者一定非常了解Windows主题,当选择不同的主 题设置时,Windows用户界面将会发生很大的变化。 提供了同样的主题的技术,这让用户可以对 Web站点进行统一的控制,很多Blog站点都提供了主题 选择功能,当选择不同的主题时会发现页面的很多方面 发生了变化,比如控件的显示,页面的布局等等。很多 初学者容易混淆主题与CSS的区别,CSS用于控制HTML 格式的呈现,而主题则可以控制服务器控件的 很多属性,一些属性可能会生产生不一样的HTML输出。
为整个网站应用主题
除了为单个页面使用Theme或者是 StyleSheetTheme属性设置主题之外,还可以为应用程 序中的所有页面同时应用主题。可以在web.config配置 文件中配置Web应用程序的所有页面都可用的主题。
8.2.5
添加CSS样式
也可以在主题中添加样式表文件来控制页面中的 HTML元素和控件的外观,如果向主题文件夹 中添加一个CSS文件,则CSS样式将被应用到应用了主 题的任何页面。
8.3.4
在web.config中配置母版页
可以在web.config配置文件中定义母版页,这样母 版将被应用到网站中所有的文件或者是某个指定文件夹 的文件。
8.3.5
修改母版页
使用母版页将会在多个内容页上显示相同的内容, 一些页面可能想覆盖某些母模页中定义的显示,来提供 自定义的显示。比如如果想修改内容页的标题,可以在 Page区中修改Title属性。也可以通过编程的方式改变 Title属性,除此之外还可以修改CSS中的样式规格,这 是因为母版页中的HTML<head>标签具有 runat=”server”声明,表示己经被设置为服务器端Head 标签,因此开发人员可以使用Page.Header属性来访问 Header中的属性。
8.2.1
创建主题
为了在中创建主题,需要先创建一个名为 App_Themes的主题文件夹用来存放主题,该文件夹必 须位于应用程序的根目录中。在该文件夹中可以存放多 个主题设置。每个主题必须用一个单独的子文件夹进中为TextBox控件创建了一个皮肤,当在页 面上应用主题后,会发现所有的TextBox控件的呈现外观 都发生了改变,这种皮肤称为默认皮肤。开发人员可能想 为某个指定的TextBox控件应用一种不同的皮肤,此时可 以考虑使用命名皮肤。
8.2.6
动态应用主题
一些网站提供了让用户选择主题的功能,用户根据 主题外观缩略图选择一个主题,将呈现相应的外观效果。 在中可以编程的方式动态的应用主题,只需要在 PreInit事件中动态的指定Theme属性,就可以实现主题的 动态切换效果。
8.3
母版页
母版页类似于Word中的模板,允许在多个页面中共 享相同的内容。比如网站的LOGO,可能需要在多个页 面中重用,则可以将其放在母版页中。在Dreamweaver 中可以使用模板页,的母版页与此类似。使用 母版页可以简化维护、扩展和修改网站的过程。并能提 供一致、统一的外观。
8.3.1
创建母版页
母版页的使用与普通页面类似,可以在其中放置文 件或者图形,任何的HTML控件和Web控件,后置代码等 等。母版页的扩展名以.master结尾,不能被浏览器直接 查看。母版页必须在被其他页面使用后才能进行显示。
8.3.2
默认内容
当在母版页中定义了ContentPlaceHolder后,也可 以在母版页中包含默认的内容,假如内容页中没有为母 版页中的ContentPlaceHolder控件关联相应的Content 控件的话,默认内容将进行显示。
8.1
在中应用CSS样式
随着Web的越来越盛行,Web设计也越来越趋向于 整体与结构化。在早期,比如在1999年以前,Web站点 的设计者们使用HTML语法来格式化显示样式,这种方式 具有多种限制,比如在不同的浏览器中的显示效果不一 致、缺乏标准的支持、HTML代码结构混乱等等。
8.1.1
8.3.3
母版页和相对路径
笔者将母版页和相对路径划为一小节来进行讨论,是有 来由的。中母版页处理相对路径有一些奇怪,不小 心可就会让开发人员摸不着北。假如在母版页中只添加一些 文本信息,这可能并不是任何问题。但是一个真正的网站或 应用程序,通常都需要在母版页中添加很多图片,或者是其 他的HTML标签来指向其他的资源,那么将会产生问题。
8.5.2
母版页是否可以嵌套,如何嵌套?
母版页可以嵌套,可通过本章8.3.7节的介绍,做一 个实例,然后简单描述下完成这个实例的过程,此题看 似操作题,但一般都不会上机面试,通常只简单描述下 流程即可。
8.5
常见面试题分析
8.5.1 如何让一个网站默认一个母版页? 凡是全局的配置,必须得使用web.config来完成,本题可 以在其中如下设置: <configuration> <system.web> <pages masterPageFile=”~/MasterPage/MasterPage.master” /> </system.web> </configuration>
第8章
中的样式、主题和母版页
• • •
• • •
本章开始讨论的页面创作技术,现如今的网页网 站、Web Base应用程序越来越注重页面的外观和可操作性。 一致的外观能给用户良好的印象,并能充分展示企业的形象和 文化内涵。提供了多种用于统一页面外观的方法,主 要有: 样式 主题 母版页 本章内容有: 如何在中应用CSS样式 如何创建和使用主题 如何创建和使用母版页
8.2.3
处理主题冲突
当应用一个主题到页面上时,会检查Web 页面上的控件以及定义的皮肤文件以查看是否为控件定 义了属性,如果在皮肤文件中存在匹配的皮肤定义,将 覆盖控件本身的属性定义而使用皮肤定义。也就是说, 如果页面上应用了皮肤,那么在皮肤中定义的属性将具 有优先权。
8.2.4
8.3.6
动态加载母版页
可以为内容页动态的指定不同的母版页,在一些场 合,这个功能非常实用。比如网站提供了些外观的交互 式选择项,类似于现今比较流行的Blog系统,当用户选 择不同的外观时,动态的切换母版页,给用户不一样的 交互式体验。
8.3.7
母版页的嵌套
可以创建一个嵌套在其他母版页中的母版页,比如 设计一个上下两栏面局的母版页,顶栏显示网站Logo, 而底栏可能根据用户不同的需要呈现不同的页面布局, 例如左右式布局或三栏式布局等等。这时可以考虑使用 嵌套母版页,VS2010对嵌套母版页还提供了设计时的支 持。
相关主题