ASP,NET程序设计单元5-ASP,NET程序的格式处理.pptVIP

* * * * 学习单元 5 ASP.NET程序的格式处理 本单元学习目标 熟悉HTML CSS层叠样式表 掌握在ASP.NET程序中使用母版页和主题的方法 掌握ASP.NET常用导航控件的使用 5.1 任务1--设计网站界面风格 5.1.1 任务描述与场景 5.1.2 使用CSS 5.1.3 主题 5.1.4 母版页 5.1.5 任务实现 5.1.1 任务描述与场景 Web应用程序的开发通常需要考虑两个方面：功能和外观。其中，外观，包括控件的颜色、图像的使用、页面的布局可以使Web站点更美观。ASP.NET提供了皮肤、主题和母板页的功能，增强了网页布局和界面的优化功能，使开发人员可以轻松地实现在网站开发中对界面的控制。 任务目的： 以站点标题、公共导航以及版权信息等，为网站的网页布局及控件颜色实现外观的一致性，提高网站对用户的友好度，优化用户体验 。 5.1.2 使用CSS CSS（Cascading Style Sheet）层叠样式表是用来控制HTML显示的一组样式。可以对HTML中的布局、字体、颜色、背景和其他图文效果实现更加精确的控制。 使用CSS设置样式时，一般有3种方式：内嵌式，在HTML文件头内设置；内联式，在HTML标记内利用Style属性直接使用；外联式，使用以扩展名为.css的文件保存样式。 5.1.2 使用CSS (1) 1. 内嵌式CSS 。在内嵌式中，CSS一般位于HTML文件的头部，即head标记内，并且以style开始，以/style结束 使用style属性定义时，内容与值之间用冒号:分隔。用户可以定义多项内容，内容之间以分号;分隔。例：定义h1、h2标记使用的字号和颜色。 style type=text/css h1 {font-size: x-large; color:red} h2 {font-size:large; color:blue} /style 其中，style /style之间是样式的内容；Type一项使用的是Text中的CSS书写的代码；{ }前面的是样式的类型和名称，{ }中的是样式的属性。 5.1.2 使用CSS (2) 2. 内联式CSS 。这种方法主要是在HTML标记中直接使用style属性，起到对该标记括起的内容应用样式显示的效果。 例，需要使h3标记的字体的大小为10px，使用下面的语法： h3 style=“font-size: 10px”。 例：使p标记内的内容按style设置方式显示 body主流的动态网页设计软件 p style = font-size:20px; line-height:40px; background-color:#FFCC00; font-family:华文隶书; 目前，主流的动态网页设计软件主要是.NET平台的ASP.NET和Java平台的JSP。/p /body 5.1.2 使用CSS (3) 3. 外联式CSS 。CSS的可以形成单独文件，然后在HTML中引用。引用样式文件的HTML文档在头部用link标记链接CSS样式文件，link标记的属性主要有rel、href.和Type。 rel属性用于定义链接的文件和HTML文档之间的关系，通常取为stylesheet； href属性指出CSS样式文件的位置和文件名； type属性指出样式的的类别（通取值为text/css）。如下代码是引用定义CSS样式的外部style.css文件。 例： link rel= stylesheet href= “style.css type= text/css 5.1.2 使用CSS (3) 3. 外联式CSS 。CSS的可以形成单独文件，然后在HTML中引用。引用样式文件的HTML文档在头部用link标记链接CSS样式文件，link标记的属性主要有rel、href.和Type。 rel属性用于定义链接的文件和HTML文档之间的关系，通常取为stylesheet； href属性指出CSS样式文件的位置和文件名； type属性指出样式的的类别（通取值为text/css）。如下代码是引用定义CSS样式的外部style.css文件。 例： link rel= stylesheet href= “style.css type= text/css 5.1.3 主题 主题，(Theme)，指一组应用于特定控件的样式声明（也称作皮肤）。主题可以设置样式属性、图像、颜色和其他特性。通过应用主题，可以为网站中的网页提供一致的外观。 主题与CSS的主要区别在于：主题基于控件而不是HTML，使用主题常用步骤 1．为网站创建主题 主题文件位于在