第12章的身体皮肤、主题和母版页.pdf

第12 章 ASP.NET 的皮肤、主题和母版页 在Web 应用程序开发中，一个良好的Web 应用程序界面能够让网站的访问者耳目一新，当用户访 问Web 应用时，网站的界面和布局能够提升访问者对网站的兴趣和继续浏览的耐心。ASP.NET 提供了 皮肤、主题和模板页的功能增强了网页布局和界面优化的功能，这样即可轻松的实现对网站开发中界面 的控制。 12.1 皮肤和主题 皮肤和主题是自ASP.NET 2.0 就包括的内容，使用皮肤和主题，能够将样式和布局信息分解到单独 的文件中，让布局代码和页面代码相分离。主题可以应用到各个站点，当需要更改页面主题时，无需对 每个页面进行更改，只需要针对主题代码页进行更改即可。 12.1.1 CSS 简介 在任何Web 应用程序的开发过程中，CSS （Cascading Style Sheets，级联样式表）都是非常重要的 页面布局方法，而且CSS 也是最高效的页面布局方法。CSS 发展于1994 年10 月，是为了补救HTML 3.2 语法中的不足，但是由于当时网络的发展的不足和浏览器的支持率较低，直到 1996 年底，才正式发表 了CSS 1.0 规格，也正是1996 年之后，浏览器才开始正式的支持CSS 。 在网页布局中，CSS 经常被使用于页面样式布局和样式控制。熟练的使用CSS 能够让网页布局更加 的方便，在页面维护时，也能够减少工作量。通常CSS 能够支持三种定义方式，一是直接将样式控制放 置于单个HTML 元素内，称为内联式；二是在网页的head 部分定义样式，称为嵌入式；三是以扩展名 为.css 文件保存样式，称为外联式。 这三种样式适用于不同的场合，内联式适用于对单个标签进行样式控制，这样的好处就在于开发方 便，而在维护时，就需要针对每个页面进行修改，非常的不方便；而嵌入式可以控制一个网页的多个样 式，当需要对网页样式进行修改时，只需要修改head 标签中的style 标签即可，不过这样仍然没有让布 局代码和页面代码完全分离；而外联式能够将布局代码和页面代码相分离，在维护过程中，能够减少工 作量。 12.1.2 CSS 基础 CSS 能够通过编写样式控制代码来进行页面布局，在编写相应的HTML 标签时，可以通过Style 属 性进行CSS 样式控制，示例代码如下所示。 body div style=font-size:14px;这是一段文字/div /body 上述代码使用内联式进行样式控制，并将属性设置为font-size:14px，其意义就在于定义文字的大小 为14px；同样，如果需要定义多个属性时，可以同写在一个style 属性中，示例代码如下所示。 body div style=font-size:14px;这是一段文字1/div div style=font-size:14px; font-weight:bolder这是一段文字2/div div style=font-size:14px; font-style:italic这是一段文字3/div div style=font-size:14px; font-variant:small-capsThis is My First CSS code/div div style=font-size:14px; color:red这是一段文字5/div /body 上述代码分别定义了相关属性来控制样式，并且都使用内联式定义样式，这些CSS 的属性的意义如 下所示：  字体名称属性 （font-family ）：该属性设定字体名称，如Arial, 、Tahoma, 、Courier 等，可以定 义字体的名称。  字体大小属性 （font-size ）：该属性可以设置字体的大小。字体大小的设置可以有多种方式，最 常用的就是pt 和px 。  该属性有三个值可选：normal, 、italic、oblique、normal 是默认值，italic、oblique 都是斜体显示。  字体粗细属性 （font-weight ）：该属性常用值是normal 和bold ，normal 是默认值，bold 是粗体。  字体变量属性（fo