ASPNET中的CSS、主题和母版页
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
主题和母版页（层叠样式表、主题）
整合网站的第一步是采用一组一致的可视化样式。CSS 为格式化Web 页面提供了跨平台的解决方案，它可以和HTML 或则XHTML 一起工作并几乎被所有的现代浏览器支持。
使用CSS 时，可以利用样式表定义一组预定义格式，然后通过CssClass 属性把这些样式表链接到适当的控件。样式表由规则组成，每个规则定义了Web 页面中的一个元素应该如何被格式化。
每个规则的名字包含两部分：
1.点号前面表明规则要作用的HTML 元素，点号前面什么都没有表示这个规则可作
用于所有的HTML 元素。
2.点号后面的部分是一个唯一的名称，叫做CSS 类名，类名区分大小写。
.heading1
{
font-weight:bold;
font-size:large;
color:Lime;
font-family:Verdana, Arial, Sans-Serif;
}
还可以创建自动应用到HTML 标签的规则，只要把标签名作为规则名即可：
h2
{
color: Red;
}
这种自动的样式表看起来很有用，但它在 里却不是那么方便。通常你直接处理的是控件而不是独立的HTML 标签。有时候你总是不能确定将会用什么标签呈现某个控件，因此，最好通过类名显示指定规则。
如果你不喜欢手工书写CSS 规则，VS 允许使用设计器来构建。只要添加一个规则的声明，在花括号中点击鼠标右键，选择创建样式即可。
一个典型的样式表会定义大量的规则，样式表常用于正式定义网站用户界面主要的格式，参考下面的样式表：
body
{
font-family: Verdana, Arial, Sans-Serif;
font-size: small;
}
.heading1
{
font-weight: bold;
font-size: large;
color: Lime;
}
.heading2
{
font-weight: bold;
font-size: medium;
font-style: italic;
color: #C0BA72;
}
.blockText
{
padding: 10px;
background-color: #FFFFD9;
border-style: solid;
border-width: thin;
}
VS 中选择视图，其他窗口，文档大纲，可以清楚的罗列当前样式表中所有的规则，可以迅速定位到某一规则：
要在Web 页面里使用某个规则，首先页面要链接到适当的样式表，可在
节中添加如下代码（可在VS中拖动样式表进入head）：CssClass="heading1">
This paragraph uses the blockText style.
也可通过“应用样式”窗口来指定具体的规则应用（视图->应用样式），这个设计可以实现一个预览的效果，不过注意以下几点：
∙如果选中的是Web 控件，它添加或修改CssClass 属性。
∙如果选中的是普通的HTML 元素，它添加或修改Class 特性。
∙如果选中一段HTML 内容，它添加一个或 VS 还提供了更多的样式表助手，下面这些特性可以帮助你在平时管理样式： ∙“管理样式”窗口：打开一个Web 页面，可以选择“视图” -> “管理样式”。 ∙样式表工具条：它提供修改现有样式以及新增样式的按钮。（右击工具栏并勾选“样式表”复选框）。 ∙“CSS属性”窗口：这个窗口允许仔细检查样式表并修改它的格式化属性。（“视图” -> “CSS属性”）。 CSS 规则只限于一组固定的样式特性，它们允许重用特定的格式化细节（字体、边框、前景色和背景色等），但它们显然不能控制 控件的其他方面。例如，CheckBoxList 控件有一些用于控制如何把项组织为行或列的属性。虽然这些属性影响的是控件的可视外观，但它们在CSS 的范围之外，所以必须手工设置。此外，你可能还希望在定义控件格式的同时定义控件的部分行为。例如，你可能希望标准化Calender 控件的选择模式或者TextBox 控件的折行。显然，这些都不可能通过CSS 实现。 主题弥补了这一缺陷。和CSS 相似，主图允许定义一组作用于多个页面中控件的样式特性。不过，和CSS 不同的是，主题不是由浏览器实现的。相反，它们是在服务器上实现的 自有的解决方案。 主题不会代替样式，但它们可以提供CSS 不能提供的一些特性。下面是它们的主要区别： ∙主题基于控件而不是HTML。主题允许定义和重用几乎所有的控件属性。例如，可以在主题中定义一组通用的节点图片并把它们应用于多个TreeView 控件， 还可以为多个GridView 控件定义一组模版。CSS 只是直接作用于HTML 的样式特性。 ∙主题应用在服务器上。主题作用到页面时，样式化后的最终页面被传送给用户。而使用样式表时，浏览器同时接收到页面和样式信息并在客户端合并它们。 ∙主题不会像CSS 那样层叠。如果在一个主题和另一个控件里同时指定了一个属性，那么主题里定义的值会覆盖控件的属性。不过，有一个方法可以改变这个行 为，提高页面属性的优先级，这样主题的行为将更像样式表。 所有的主题都是与应用程序相关的。要在Web 应用程序里使用主题，必须创建一个定义它的文件夹，这个文件夹必须放在一个叫做App_Themes 的文件夹里，而App_Themes 又必须位于Web 应用程序的顶层目录中。 只要每个主题都在一个单独的文件夹里，应用程序就可以定义多个主题。对于一个给定的页面，每次只能有一个主题处于活动状态。 要让主题真正有效，必须在主题文件夹里创建至少一个外观文件。外观文件是一个使用 .skin 扩展名的文本文件。 不会直接提供外观文件，相反，它们用于在幕后定义主题。