第05章ASPNET设计基础_第1页
第05章ASPNET设计基础_第2页
第05章ASPNET设计基础_第3页
第05章ASPNET设计基础_第4页
第05章ASPNET设计基础_第5页
已阅读5页,还剩60页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

1、1 15.1 5.1 WebWeb应用程序开发工具应用程序开发工具5.2 5.2 页面设计基础页面设计基础5.3 5.3 WebWeb应用程序中的常用对象应用程序中的常用对象5.4 5.4 网页切换与网页间数据传递网页切换与网页间数据传递第第5 5章章 ASP.NETASP.NET程序设计程序设计- - 设计基础设计基础2 25.1 Web5.1 Web应用程序开发工具应用程序开发工具 WebWeb应用程序对页面请求的处理有两种方式:应用程序对页面请求的处理有两种方式:n 服务器响应请求服务器响应请求页面请求在服务器端处理业务逻辑,处理完成后再将其页面请求在服务器端处理业务逻辑,处理完成后再将

2、其转变为页面元素发送到客户端。转变为页面元素发送到客户端。ASP.NETASP.NET首选首选C#C#编写服务器端处理程序。编写服务器端处理程序。n 客户端处理请求客户端处理请求页面请求直接在客户端进行处理。页面请求直接在客户端进行处理。ASP.NETASP.NET一般选择一般选择JavaScriptJavaScript编写客户端脚本程序。编写客户端脚本程序。3 35.1 Web5.1 Web应用程序开发工具应用程序开发工具 典型典型ASP.NETASP.NET程序开发环境:程序开发环境:n C#C#:运行在服务器端,用于处理各种业务逻辑。:运行在服务器端,用于处理各种业务逻辑。n HTMLH

3、TML或者或者XHTMLXHTML:由客户端浏览器解析执行,用于在客户端:由客户端浏览器解析执行,用于在客户端呈现页面。呈现页面。n JavaScriptJavaScript:运行在客户端,靠客户端浏览器解析执行,用:运行在客户端,靠客户端浏览器解析执行,用于处理一些与于处理一些与页面控制相关页面控制相关的工作。的工作。n CSSCSS:由客户端浏览器解析执行,用于控制在客户端呈现的:由客户端浏览器解析执行,用于控制在客户端呈现的页面元素样式。页面元素样式。4 45.1 Web5.1 Web应用程序开发工具应用程序开发工具 ASP.NETASP.NET程序主要文件构成:程序主要文件构成:用用C

4、#C#语言编写的语言编写的ASP.NET WebASP.NET Web程序时,每个网页默认都程序时,每个网页默认都由两个部分构成。由两个部分构成。n 页面文件页面文件( . .aspxaspx):用于设计能被用户看见的界面。以:用于设计能被用户看见的界面。以hthtmlml代码形式在客户端浏览器中可以得到解析。代码形式在客户端浏览器中可以得到解析。n 代码隐藏文件代码隐藏文件(. .aspx.csaspx.cs):用于实现页面逻辑功能。:用于实现页面逻辑功能。这种程序组织结构,实现了MC-V的分离,但要真正达到M-V-C三者分离架构,需要在VS2008中去体验,该版本增加MVC处理机制!5 5

5、页面文件页面文件 Page Page 指令指令n Page指令指令定义了定义了 ASP.NET 页解析器和编译器使用的页解析器和编译器使用的特定于页面的属性特定于页面的属性n 它它用于在处理和编译某页面时配置与此页面相关的属性用于在处理和编译某页面时配置与此页面相关的属性n 每个每个 ASPX ASPX 页只能有一个页只能有一个 Page Page 指令指令 n Page Page 指令的语法如下:指令的语法如下: 6 6 Page Page 指令的属性指令的属性指定在编译时和页面的代码声明块中使用的语言指示能否自动处理页面的事件指定编译的文件名称,此文件含有与此页面关联的类指定由页面继承的代

6、码隐藏类 7 7脚本部分脚本部分 脚本部分脚本部分 服务器端脚本 客户端脚本 由服务器执行由浏览器执行C#VBJavaScript8 8客户端脚本客户端脚本 客户端脚本是页面的一部分,当用户请求页面时,就将这些脚本发送至浏览器 客户端脚本可以: n在将某个页面加载至浏览器中时,改变此页面的外观n验证用户在窗体中输入的数据,将通过验证的数据发送至服务器 n当触发按钮的点击事件时,在浏览器中显示相关信息 9 9服务器端脚本服务器端脚本 n 服务器脚本也是页面的一部分,但它不发送至浏览器,而是在请求页面之后和在回送至浏览器之前由服务器处理这些脚本n 代码可包含在服务器端的 代码声明块中,也可包含在

7、显示块中n ASP.NET 支持用任何语言编写的用于运行时的服务器端代码 n 服务器端代码声明块必须具有 runat=server 属性 1010ASP.NET ASP.NET 网页工作基本特征网页工作基本特征 n 回发和往返行程回发和往返行程ASP.NET 页面作为代码在服务器上运行。因此,要得到处理,页面必须配置为当用户单击按钮(或者当用户选中复选框或与页面中的其他控件交互)时提交到服务器,以便它可以再次运行其服务器代码,然后向用户呈现其自身的新版本。ASP.NET 网页的处理循环如下:用户请求页面。(使用 HTTP GET 方法请求页面。)页面第一次运行,执行初步处理(如果您已通过编程让

8、它执行初步处理)。页面将标记动态呈现到浏览器,用户看到的网页类似于其他任何网页。用户键入信息或从可用选项中进行选择,然后单击按钮。(如果用户单击链接而不是按钮,页面可能仅仅定位到另一页,而第一页不会被进一步处理。)页面发送到 Web 服务器。(浏览器执行 HTTP POST 方法,该方法在 ASP.NET 中称为回发。)更明确地说,页面发送回其自身。例如,如果用户正在使用 Default.aspx 页面,则单击该页上的某个按钮可以将该页发送回服务器,发送的目标则是 Default.aspx。在Web服务器上该页再次运行。并且可在页上使用用户键入或选择的信息。页面执行您通过编程所要实行的操作。页

9、面将其自身呈现回浏览器。1111n Web Web 窗体页的生命周期窗体页的生命周期 初始化页面 阶段阶段引发的事件引发的事件Page_Init 加载页面 验证 事件处理 页面卸载 Page_LoadValidate Form event handlerPage_Unload 页面显示之前Page_PreRenderASP.NET 通过下列方式帮助保留其他页面信息: ASP.NET 会在往返行程间保存控件设置(属性),这种行为称为保存控件状态。 ASP.NET 提供状态管理功能,以便您可以在往返行程间保存您自己的变量和应用程序特定或会话特定的信息。 ASP.NET 可以检测何时第一次请求页面以

10、及何时发送页面,这使您可以相应地进行编程。例如,您可能想要在第一次显示页面(而不是在每次回发)时从数据库读取信息。在页面处理的某些特定阶段,页面会自动触发一些事件。而与服务器控件相关联的其他事件则在服务器端触发并得到处理1212n ASP.NETASP.NET网页编程网页编程可以使用 .NET Framework 支持的各种语言(包括 Visual Basic、C# 和 J#)为ASP.NET 网页创建服务器代码。ASP.NET 网页可以包含在浏览器中运行的客户端脚本。某些 ASP.NET 功能会生成客户端脚本,并将其插入到页面中。在这种情况下,ASP.NET始终会生成 JavaScript,

11、以实现最佳跨浏览器功能。此外,可以添加自己的客户端脚本以实现自定义功能,以便使用与目标浏览器兼容的任何客户端脚本语言。大多数ASP.NET服务器控件仅支持很少的几个可以在服务器代码中处理的事件。要处理某个事件,页面必须执行一次往返行程(即回发回发PostbackPostback或回调回调CallbackCallback操作),以便用户的选择可以发送到页面以待处理。服务器控件不公开诸如onmouseover 之类的高频率事件,因为每次引发此类事件时,都会发生到服务器的另一个往返行程,这将显著影响页面中的响应时间。但是,可以将ASP.NET服务器控件配置为引发客户端事件,例如onmouseover

12、。在这种情况下,控件不发送回服务器,因而由创建的客户端脚本来响应事件。 1313n PostbackPostback(回发)(回发)和 CallbackCallback(回调)(回调)ASP.NET1.1中的 Postback 机制 在1.1中,每个服务器控件都有一个 AutoPostback属性。它的作用是当用户(客户端)修改该控件的值,即也可以说是当该控件的事件触发的时候,客户端就通过JavaScript: _doPostback(object,EventArgument)来和服务端实现通信。它使得程序员在实现动态的获取服务端数据变得非常方便。 在这整个过程中,作为用户肯定是要经历一个刷新

13、全页面的过程。如果一个复杂的填写表单的页面,该页面有大量的Control是相关的,需要 根据其它Control的选择情况去动态的绑定数据,那当用户填完这个表单的时候也许眼睛也花了,从 Experience方面来讲将是非常差的。 在不是从服务端获取大量数据的情况下,如何才能避免这种在用户看似多余的Postback呢? 1414ASP.NET2.0中的新功能Script Callback 机制 在ASP.NET2.0中,客户端的脚本功能已经被扩展了。并且增加了 Script Callback(通过脚本建立于后台的链接)。设计时,可以用程序去控制标签,通过程序控制input焦点,读取或者设置页面的标

14、题,并且可以控制button或其他的控件提交到其他任何页面(in the application)。 为了使用ASP.NET2.0中的回调技术,需要在页面中定义一个触发元件(注意,不是提交按钮Submit button)并且把它绑定上JavaScript代码。这段代码会重新获得当前页面的input数据并且准备去呼叫系统提供的一个称为 WebForm_DoCallback的Script函数。这个函数会建立一个和一个指定的远程ASP.NET页面建立HTTP连接。后台侦听到这个来自客户端的呼叫后呢,对此触发一个方法。服务端通过先前的客户端的函数返回一个值。在客户端,通过一个用户自定义的脚本函数来获得

15、服务端的值 并且用DHTML将其呈现在页面上。重要的是,这样做客户端和服务端的通信仍旧在进行,但是页面并没有重新刷新。更重要的是,当客户端在获取数据的时候,用户仍旧可以在它原来的页面上操作。 关于Callback的用例请参阅以下备注页的内容。 可以这样理解,Callback机制是Ajax之前的无刷新技术,需要人工书写较多的代码,现在一般使用Ajax技术来简化设计!1515Page_Load Page_Load 事件事件n 在加载页面时会触发 Page_Load 事件n ASP.NET 将自动调用 Page_Load 子程序,并执行其中的代码private void Page_Load(obje

16、ct sender, System.EventArgs e)Response.Write(欢迎大家访问);从此处调用 Page_Load 事件只要加载页面,就会执行 Page_Load 事件内的代码1616Page.IsPostBackPage.IsPostBack 属性属性 只有在首次加载页面时,才执行的 Load 事件中的代码 , 可以通过使用Page.IsPostBack 属性达到目的 如果 Page.IsPostBack 属性值为False,则此页面为首次加载!用户界面1717Page.IsPostBackPage.IsPostBack 属性属性 private void Page_L

17、oad(object sender, System.EventArgs e) if ( !Page.IsPostBack)Time.Text = System.DateTime.Now.ToString();private void btnSubmit_Click(object sender, System.EventArgs e) Message.Text=请确定您填写的信息:+name.Text+ +age.Text+ +habbit.Text; Page_Load 事件如果页面为首次加载,则Page.IsPostBack 属性的值是 False,并显示日期和时间单击提交按钮后,日期和时间

18、都将保持不变1818代码隐藏代码隐藏.aspx 文件显示内容HTML,服务器控件静态文本等.aspx.cs 文件应用程序逻辑 这就是代码隐藏分离1919代码隐藏代码隐藏 three.aspx 表示文件 . ( three.aspx )代码隐藏文件在代码隐藏文件中定义的事件代码隐藏文件略为复杂。它含有一个未编译的 Visual C# 类文件2020代码隐藏代码隐藏代码隐藏文件 ( three.aspx.cs ) using System;using System.Data;public partial class three : System.Web.UI.Page protected void

19、 Page_Load(object sender, EventArgs e) protected void Button1_Click(object sender, EventArgs e) Response.Write(您好); 继承自 Page 类 从表示文件调用 Button click 事件单击按钮后执行的功能21215.25.2 页面设计基础页面设计基础5.2.1 HTML5.2.1 HTML 在在ASP.NETASP.NET中,网页的默认扩展名为中,网页的默认扩展名为. .aspxaspx,页面中呈现的,页面中呈现的所有内容都放在标记所有内容都放在标记和和之间。之间。 每个页面文档

20、都包含首部(每个页面文档都包含首部(headhead)和主体()和主体(bodybody)两部分,)两部分,主体紧接在首部的后边。主体紧接在首部的后边。22225.2.1 HTML5.2.1 HTMLu 基本格式:基本格式: HTMLHTML文档文档= =首部(首部(headhead)+ +主体(主体(bodybody)u 首部:由标记首部:由标记和和之间的内容构成。用于设置之间的内容构成。用于设置H HTMLTML文件的标题、作者等信息(浏览器中不显示)。首部中文件的标题、作者等信息(浏览器中不显示)。首部中可包含标题标记符可包含标题标记符 title title 、样式标记符、样式标记符

21、stylestyle、脚本语言、脚本语言标记符标记符 scriptscript等。等。u 主体:由标记主体:由标记和和之间的内容构成。网页中的之间的内容构成。网页中的所有内容,包括文字、图形、链接以及其他页面元素都包含所有内容,包括文字、图形、链接以及其他页面元素都包含在该标记符内。在该标记符内。23235.2.1 HTML5.2.1 HTMLu HTMLHTML文档的一般形式为文档的一般形式为 : : 文档标题文档标题 这是这是xhtmlxhtml文档的主体部分文档的主体部分 u 在在HTMLHTML文档中,文档中,标记标记和和/ /标记标记都是配对使用的。都是配对使用的。24245.2.1

22、 HTML5.2.1 HTML 中可以包含属性,一般格式为:中可以包含属性,一般格式为:标记标记 属性属性1=1=值值1 1 属性属性2=2=值值2 2 例如:例如: / 标记之间必须使用空格隔开,属性名和属性值之间用等号隔开,等号标记之间必须使用空格隔开,属性名和属性值之间用等号隔开,等号左边是属性名称,右边是属性值。左边是属性名称,右边是属性值。表表13-1: 13-1: 常用的常用的HTMLHTML标记。标记。25255.2.1 HTML5.2.1 HTML 表格除了可直接在单元格内显示内容,还可表格除了可直接在单元格内显示内容,还可将整个页面划分为若干个将整个页面划分为若干个独立的部分

23、独立的部分,精确地定位文本、图像或其它元素。表格由行和列组成,精确地定位文本、图像或其它元素。表格由行和列组成,行列交叉构成了单元格。如下面代码对应右边的图:行列交叉构成了单元格。如下面代码对应右边的图: 第一行第一个单元格第一行第一个单元格 第一行第二个单元格第一行第二个单元格 / 在这段代码中,在这段代码中,每一个每一个 作为一行,每一个作为一行,每一个作为该行中的一个单元格。作为该行中的一个单元格。26265.2.2 CSS5.2.2 CSS 层叠样式表简称层叠样式表简称CSSCSS(C Cascading ascading S Style tyle S Sheetsheets),它),

24、它可以控制网页中一可以控制网页中一个或多个元素的外观。个或多个元素的外观。由于改变样式表中任何一个元素的显示样式,网页由于改变样式表中任何一个元素的显示样式,网页中所有与该样式级联的元素都会自动发生改变,因此使用中所有与该样式级联的元素都会自动发生改变,因此使用样式表可以减少样式表可以减少很多具有相同外观元素的重复设置工作很多具有相同外观元素的重复设置工作,从而给网页的设计和维护带来了,从而给网页的设计和维护带来了很大的方便。很大的方便。 样式是指每一个网页元素呈现在浏览器中的风格,例如:字体的大小、颜样式是指每一个网页元素呈现在浏览器中的风格,例如:字体的大小、颜色,页面的背景色和背景图等。

25、样式属性与值之间用冒号色,页面的背景色和背景图等。样式属性与值之间用冒号:分隔,如果分隔,如果一个样式中有多个样式属性,各样式属性之间要用分号一个样式中有多个样式属性,各样式属性之间要用分号;隔开。隔开。 样式表就是将网页元素的样式定义设计为一个独立的文件。凡是在网页的样式表就是将网页元素的样式定义设计为一个独立的文件。凡是在网页的headhead部分与该样式表文件建立链接的部分与该样式表文件建立链接的HTMLHTML文件,其页面元素的样式就会按文件,其页面元素的样式就会按照样式表中的定义显示。样式文件的扩展名为照样式表中的定义显示。样式文件的扩展名为. .csscss。 在网页文件中引用该样

26、式文件,只需要在网页的在网页文件中引用该样式文件,只需要在网页的与与之间添之间添加如下代码:加如下代码:link /27275.2.3 JavaScript5.2.3 JavaScript JavaScriptJavaScript用于在客户端直接对页面中的元素进行编程控制,用于在客户端直接对页面中的元素进行编程控制,因为因为JavaScriptJavaScript是在客户端运行,所以可以不必依赖于服务器是在客户端运行,所以可以不必依赖于服务器端的程序。端的程序。 JavaScriptJavaScript代码包含在代码包含在scriptscript块中,一般格式如下:块中,一般格式如下: Jav

27、aScriptJavaScript代码代码 28285.2.3 JavaScript5.2.3 JavaScript1 1响应并处理客户端事件响应并处理客户端事件利用利用JavaScriptJavaScript可以响应鼠标移动、进入某个控件区域、离开某个控件区域可以响应鼠标移动、进入某个控件区域、离开某个控件区域等事件,并编写对应的等事件,并编写对应的JavaScriptJavaScript事件代码。事件代码。2 2弹出窗口弹出窗口(1 1)弹出新窗口)弹出新窗口通过调用通过调用windowwindow对象的对象的openopen方法,可以生成一个新窗口。格式如下:方法,可以生成一个新窗口。格

28、式如下: window.open(URL,windowName,(windowFeaturewindow.open(URL,windowName,(windowFeature)其中,其中, 如果如果open(open( ) )成功就返回一个新的成功就返回一个新的windowwindow对象,否则就返回对象,否则就返回NULLNULL; URL URL用来指定新打开窗口中的用来指定新打开窗口中的HTMLHTML文件的位置,此项也可以为空;文件的位置,此项也可以为空; windowNamewindowName是窗口名;是窗口名; windowFeaturewindowFeature是用于设置窗口属

29、性的可选参数,项与项之间用逗号分开。是用于设置窗口属性的可选参数,项与项之间用逗号分开。29295.2.3 JavaScript5.2.3 JavaScript(2 2)弹出消息框)弹出消息框有如下有如下3 3种类型的消息框。种类型的消息框。 警告信息框警告信息框AlertAlert格式:格式:window.alertwindow.alert( sMessagesMessage )功能:弹出一个警告信息框,功能:弹出一个警告信息框,sMessagesMessage是用户输入的警告信息(字符串)。是用户输入的警告信息(字符串)。 选择信息框选择信息框ConfirmConfirm格式:格式:win

30、dow.confirmwindow.confirm( sMessagesMessage )功能:弹出一个选择信息框,功能:弹出一个选择信息框,sMessagesMessage是用户输入的信息。该信息框有是用户输入的信息。该信息框有【确确定定】和和【取消取消】两个按钮,单击两个按钮,单击【确定确定】按钮时,返回按钮时,返回truetrue;单击;单击【取消取消】按钮时,返回按钮时,返回falsefalse。 对话信息框对话信息框PromptPrompt格式:格式:mpt(sMessage,sDefaultVmpt(sMessage,sDefault

31、Value 功能:弹出一个对话信息框,功能:弹出一个对话信息框,sMessagesMessage是用户输入的提示信息,该信息框中是用户输入的提示信息,该信息框中有一个文本输入框,有一个文本输入框,sDefaultValuesDefaultValue是文本框中的默认值。该消息框返回是文本框中的默认值。该消息框返回用户输入的整数或字符串。用户输入的整数或字符串。30305.2.4 VS20055.2.4 VS2005创建网页基础创建网页基础 用VS2005创建网页,可采用设计模式或源模式设计网页。在可视化设计模式下,可使用类似Word程序编辑文章的方法编辑网页文字,可把VS2005工具箱中HTML

32、控件放置到窗体中,将会自动生成htm网页。 1 1设计环设计环境境31312 2用表格用表格( (TABLETABLE) )进行页面布局进行页面布局 在网页设计中,总是希望网页中的文字、图像等对象位于网页的指定位置,这个工作被称作页面布局。可以用表格把网页分为不同部分,不同对象放到表格的不同单元中,达到页面布局的功能。用HTML语言标记一个2行3列的表格采用如下格式: 第1行第1列 第1行第2列 第1行第3列 第2行第1列 第2行第2列 第2行第3列 3232 可使用VS2005可视化模式设计表格,将表格控件放到页面上,用属性窗口修改其属性,类似Word程序那样修改表格,例如合并表格的单元格,

33、可拖动鼠标选中要合并的单元格,右击表格,在快捷菜单中单击合并单元格菜单项,既可完成合并单元格工作。单击菜单布局|插入表菜单项,打开插入表对话框,在对话框中可选自定义表格,也可选择模版。3333 第1行第1列 第2行第1列显示网页e5_2_3.htm,不支持iframe标记 的浏览器显示iframe标记之间的字符 【例例】在表格的单元中使用在表格的单元中使用iframeiframe标记显示其他网页文件。标记显示其他网页文件。34343.3.用层用层( (DIVDIV) )进行页面布局进行页面布局 称为分隔标记,可把文字、图像或其他对象放在标记中,称作为层,通过设定标记的相应属性,可以为标记中这些

34、控件设置共同的属性,例如共同位置、共同样式等,还可以使用语句控制层中的所有对象同时移动、显示或隐藏。 单击菜单布局|插入层菜单项,即可在页面上添加一个层!3535【例】在网页中定义一个层,层中包括一个标题、一个段落和一幅图像,设置层的样式,使层中所有对象居中对齐。步骤如下: q 使用VS2005将存本网页的文件夹作为网站打开,单击菜单网站|添加新项菜单项,弹出添加新项的对话框,在对话框中选中HTML页,文件命名,单击添加按钮,打开一个网页编辑窗口。单击网页编辑窗口左下侧的设计标签,转换为可视化设计模式,见下图左侧。 q单击菜单布局|插入层菜单项,增加一个层,用鼠标拖动层到指定位置,用鼠标拖动层

35、的边界改变层的宽和高。右击该层,在快捷菜单中选中样式菜单项,打开样式生成器对话框,如下图。按照图中那样选择,既文本居中对齐。36363737q 在标记中增加一个标题、一个段落和一幅图像,最终层的标记如下: 这是标题 这是段落 3838q 在标记中,增加了样式属性style,它是层中所有对象共同的属性,它可有多个子属性,用如下格式为其赋值:style=子属性:子属性值;子属性:子属性值; 子属性text-align表示对齐方式,可以是center(居中对齐)、Left(左对齐)和Right(右对齐)。width 和height表示层的宽和高。px意义是像素。left和top分别表示层的矩形外边界

36、左上角的点相对于其他控件的位置。position决定层如何定位,值absolute表示层的left和top属性是层的矩形外边界左上角的点到层的父容器的左边界和上边界距离,允许层重叠;默认值为static表示按控件在网页文件中定义顺序在窗体中排列控件,对象不可层叠;relative类似static,但允许定义和前面控件的相对位置,即层的left和top属性是相对于层的前面控件。 如果多个层有重叠,子属性z-index指明这些层的叠放顺序,在重叠部分,z-index小的层将被z-index大的层覆盖。 3939 打开该网页,可以看到标题、段落和图像都在网页的居中位置。 标记还可以嵌套,例如可以将一

37、个层做为其他层的父层,用来显示网页的背景,其样式style的子属性z-index的值小于其他层z-index的值,其他层的内容都可以覆盖父层显示的背景。 如何获得嵌套子层? 2010.3.31 在插入某个布局层后,设计视图内选择该层,此时注意观察标记层次导航图,确认为父层级后选择布局|插入层,该新插入层即为导航位置所选层的子层(嵌套层)。 关于标记层次导航图请参阅右图指示。 又如有些网页的广告窗口总是在最前边,也可以使用层的概念实现。 标记样式style还有一些其他子属性:visibility: visible(或hidden),层显示(或隐蔽);background-color层背景的颜色;

38、background-image层的背景图像。 所有标记样式style的子属性都可以通过样式生成器对话框设置。 40404. CSS4. CSS样式文件样式文件 上节介绍了标记的样式属性style的使用,实际上任何一个HTML控件和标记都有属性style,通过为其子属性赋值,可设置它们的样式风格,例如将某标题设置为居中对齐:这是一个标题 如果一个网页中有多个h4标题都要设置为居中对齐,可采用在标记中统一为h4标题设置样式属性style。下例为h4、h5标题统一设置格式,设置格式如下: h4text-align:center; color:Red; h5text-align:center; co

39、lor:blue; 4141 一个网站有很多网页,一般希望网站所有网页都具有相同的样式风格。更进一步,如果希望网页的内容和显示风格样式彻底分离,网页只包括显示数据,网页的显示风格样式定义在另一个文件中,改变显示风格样式文件,网页就可以按照不同的风格样式显示,这样的结果是一个只包括显示数据的HTML页面可以通过CSS的不同定义,显示在任何地方,任何网络设备上。这就是CSS样式文件要达到的目的,CSS样式文件扩展名为.css。 下面介绍vs2005环境下CSS样式的定义和使用。4242 vs2005vs2005中创建中创建CSS CSS 样式表样式表n 在解决方案资源管理器中,右击网站的名称(如在

40、解决方案资源管理器中,右击网站的名称(如 C:C:WebSitesWebSites),再单击),再单击 添加新项添加新项 。n 在在Visual Studio Visual Studio 已安装的模板已安装的模板 之下单击之下单击 样式表样式表 。 n 在在 名称名称 框中,键入框中,键入 * * * *. .csscss ,再单击,再单击 添加添加 。n 编辑器打开一个包含编辑器打开一个包含 bodybody 样式元素的新样式表。样式元素的新样式表。n 将插入点定位到将插入点定位到 body body 元素的右大括号之后,右击,再单击元素的右大括号之后,右击,再单击 添加样式规则添加样式规则

41、 。n 出现出现 添加样式规则添加样式规则 对话框。对话框。 n 从中可以创建绑定到特定从中可以创建绑定到特定 HTML HTML 元素类型、样式类名或特定元素的新样式。元素类型、样式类名或特定元素的新样式。n 至此,按照需要设计出样式规则。下面进行具体样式的设置。至此,按照需要设计出样式规则。下面进行具体样式的设置。n =n 将插入点定位在某个规则的左右大括号将插入点定位在某个规则的左右大括号 ( ) ( ) 之间,右击,再单击之间,右击,再单击 生成样式生成样式 。n 出现出现 样式生成器样式生成器 对话框。对话框。n 单击单击 字体字体 ,在,在 字体属性字体属性 下单击位于下单击位于

42、颜色颜色 框右边的省略号框右边的省略号(),在,在 颜色选取器颜色选取器 对话框中单击一种亮色,再单击对话框中单击一种亮色,再单击 确定确定 。n 单击单击 背景背景 ,单击一种与前面步骤中选定的字体颜色对比的暗色(如,单击一种与前面步骤中选定的字体颜色对比的暗色(如 褐紫红色褐紫红色 。n n 按照需要,创建出所有规则内的样式!按照需要,创建出所有规则内的样式!上述过程请参阅后面图片演示!上述过程请参阅后面图片演示!4343添加样式规则对话框可以创建绑定到特定 HTML元素类型、样式类名或特定元素的新样式。123454444使用样式生成器可以完成字体、文本及背景等多个属性的样式设置。6784

43、545此外,“添加样式规则”对话框还可以创建层次结构的样式规则。4646 vs2005vs2005中应用中应用CSS CSS 样式表样式表n 打开打开 Default.aspxDefault.aspx 页并切换到页并切换到 设计设计 视图。视图。n 从解决方案资源管理器中,将从解决方案资源管理器中,将 * * * *. .csscss 文件鼠标拖动到页面上。文件鼠标拖动到页面上。n 设计图页面已更新,并显示样式表的效果;源码图则会自动添加一条语句:设计图页面已更新,并显示样式表的效果;源码图则会自动添加一条语句: 实现样式表的页面链接,达到页面样式设置。实现样式表的页面链接,达到页面样式设置。

44、 此外,可以在页面设计视图,选择控件元素,利用右键快捷菜单的此外,可以在页面设计视图,选择控件元素,利用右键快捷菜单的 样式样式 项打开项打开 样样式生成器式生成器 ;或在该控件属性窗口设置;或在该控件属性窗口设置 CssClassCssClass 属性属性 两种形式进行页面的样式设计!两种形式进行页面的样式设计!4747 vs2008vs2008中应用中应用DIV+CSSDIV+CSSn DivDiv元素相关操作元素相关操作 1)1)源码状态下先定位插入点,选择图示源码状态下先定位插入点,选择图示DIVDIV层的等级,点击右边的下箭头会弹出层的等级,点击右边的下箭头会弹出两个选择项(见示意图

45、中红框线处):两个选择项(见示意图中红框线处):选选“选择标记选择标记”项,意味着添加同一级项,意味着添加同一级DIVDIV层;层;选选“选择标记内容选择标记内容”项,意味着添加下一级子项,意味着添加下一级子DIVDIV层。层。2)2)在工具箱中单机拖动或双击在工具箱中单机拖动或双击HTMLHTML下的下的DivDiv,实施网页添加,实施网页添加DIVDIV层元素层元素n csscss样式表文件相关操作样式表文件相关操作 1)1)在项目中添加一个样式表文件:如:在项目中添加一个样式表文件:如:css.csscss.css 右击解决方案资源管理器窗中的项目右击解决方案资源管理器窗中的项目| |添

46、加新项添加新项| |样式表样式表2)2)样式表设计:样式表设计: 打开样式表文件,在设计窗口,右击指定内容区域,用快捷菜单操作;所见即打开样式表文件,在设计窗口,右击指定内容区域,用快捷菜单操作;所见即所得。所得。主要就是主要就是“添加样式规则添加样式规则”和和“生成样式生成样式”两个操作,参阅下一张幻灯片。两个操作,参阅下一张幻灯片。3)3)为指定网页应用样式表:为指定网页应用样式表: 从解决方案资源管理器窗中,从解决方案资源管理器窗中,拖动样式表文件至打开的网页文件拖动样式表文件至打开的网页文件的视计视图中,的视计视图中,即可。即可。 48481234549495.5.母版页母版页 使用母

47、版页可以为网站中的所有网页创建一致的外观和布局。母版页包括网站中所有网页的共同部分,例如一个网站的题头和导航栏。可以创建一个母版页和其他包含要显示内容的网页。当用户请求包含内容的网页时,这些内容网页与母版页合并,将母版页的布局与内容网页的内容组合在一起输出。 关于母版页的定义使用后面还有详细叙述!50505.3 Web5.3 Web应用程序中的常用对象应用程序中的常用对象 在在WebWeb应用程序运行时,应用程序运行时,ASP.NETASP.NET将维护与当前应用程序、每个将维护与当前应用程序、每个用户会话、当前用户会话、当前HTTPHTTP请求、请求的请求、请求的WebWeb窗体页等有关的信

48、息。窗体页等有关的信息。 ASP.NETASP.NET页框架包含一系列封装此上下文信息的类。在代码中页框架包含一系列封装此上下文信息的类。在代码中使用这些类的实例访问内部对象。使用这些类的实例访问内部对象。51515.3 5.3 WebWeb应用程序中的常用对象应用程序中的常用对象常用的对象及对应类常用的对象及对应类对象名对象名说明说明ASP.NETASP.NET类类ResponseResponse提供对当前页的输出流的访问提供对当前页的输出流的访问HttpResponseHttpResponseRequestRequest提供对当前页请求的访问提供对当前页请求的访问HttpRequestHt

49、tpRequestServerServer公开可以用于在页之间传输控件的实用工具公开可以用于在页之间传输控件的实用工具方法,对方法,对 HTML HTML 文本进行编码和解码等文本进行编码和解码等HttpServerUtilityHttpServerUtilityApplicationApplication提供对作用于提供对作用于所有会话所有会话的应用程序范围的方的应用程序范围的方法和事件的访问等法和事件的访问等HttpApplicationStateHttpApplicationStateSessionSession为为当前用户会话当前用户会话提供信息等提供信息等HttpSessionSta

50、teHttpSessionStateViewStateViewState提供一个字典对象,用于在对同一页的多个提供一个字典对象,用于在对同一页的多个请求之间保留值请求之间保留值ContextContext提供对整个当前上下文(包括请求对象)的提供对整个当前上下文(包括请求对象)的访问访问HttpContext52525.3.1 Response5.3.1 Response与与RequestRequestuResponseResponse对象:用于向客户端发送信息,该对象提对象:用于向客户端发送信息,该对象提供了很多有用的属性和方法,常用有:供了很多有用的属性和方法,常用有: 1) 1) Res

51、ponse.Response.WriteWrite方法,用于将字符、字符串、字符数方法,用于将字符、字符串、字符数组写入组写入HTTPHTTP输出内容流。输出内容流。 例如:例如:Response.Write(thisResponse.Write(this is a test.); is a test.); 2) 2) Response.Response.WriteFileWriteFile方法,用于将指定的文件写入方法,用于将指定的文件写入HTHTTPTP输出内容流。输出内容流。 例如:例如:Response.WriteFile(test.txtResponse.WriteFile(test

52、.txt);); 3) 3) Response.Response.RedirectRedirect方法,用于将客户端重定向到新方法,用于将客户端重定向到新的的URLURL。 例如:例如:Response.Redirect(test.aspxResponse.Redirect(test.aspx););53535.3.1 Response5.3.1 Response与与RequestRequestuRequestRequest对象:获取请求的页的对象:获取请求的页的 HttpRequestHttpRequest 对象。该对象。该对象使对象使 ASP.NET ASP.NET 能够读取客户端在能够读

53、取客户端在 Web Web 请求期间发送请求期间发送的的 HTTP HTTP 值。值。 例如:例如: Request.Request.Browser.PlatformBrowser.Platform 客户端使用的操作系统客户端使用的操作系统 Request.Request.Browser.TypeBrowser.Type 客户端使用的浏览器类型客户端使用的浏览器类型 Request.Request.UserHostAddressUserHostAddress 客户端客户端IPIP地址地址Request.Request.QueryStringQueryString paraNameparaNam

54、e 获得参数值获得参数值Request.Request.FormFormcontrolNamecontrolName 获得表单控件值获得表单控件值54545.3.2 Application5.3.2 Application与与SessionSession对象对象uApplicationApplication对象是一个应用程序级的对象,它包含的数据可对象是一个应用程序级的对象,它包含的数据可以在整个以在整个WebWeb站点中被所有用户使用,并且可以在网站运行期站点中被所有用户使用,并且可以在网站运行期间持久地保存数据,即间持久地保存数据,即利用利用ApplicationApplication对象

55、可以定义类似于对象可以定义类似于所有用户所有用户公用的全局变量公用的全局变量。 由于由于ApplicationApplication对象被整个网站的所有用户使用,所以对其对象被整个网站的所有用户使用,所以对其进行操作时,需要先进行锁定,操作完成后再解除锁定。进行操作时,需要先进行锁定,操作完成后再解除锁定。 Application.LockApplication.Lock();(); ApplicationcounterApplicationcounter= (int)Applicationcounter+1;= (int)Applicationcounter+1; Application.U

56、nLockApplication.UnLock();(); 55555.3.2 Application5.3.2 Application与与SessionSession对象对象uSessionSession对象可以用来区分不同的浏览器客户。当不同的浏览对象可以用来区分不同的浏览器客户。当不同的浏览器客户访问服务器应用程序时,服务器会分别为其分配一段器客户访问服务器应用程序时,服务器会分别为其分配一段内存空间用于保存不同用户的数据信息内存空间用于保存不同用户的数据信息, ,即即每一个客户都可以每一个客户都可以有自己的有自己的SessionSession。 u定义与使用定义与使用SessionSe

57、ssion的方法的方法 : SessiononlineSessiononline=true;=true; SessioncounterSessioncounter= (int)Sessioncounter+1;= (int)Sessioncounter+1;56565.3.3 5.3.3 ViewStateViewState对象对象uViewState是ASP.NET中用来保存WEB控件回传时状态值一种机制。在WEB窗体(FORM)的设置为runat=server,这个窗体(FORM)会被附加一个隐藏的属性_VIEWSTATE。_VIEWSTATE中存放了所有控件在ViewState中的状态值

58、。 u当请求某个页面时,ASP.NET把所有控件的状态序列化成一个字符串,然后做为窗体的隐藏属性送到客户端。当客户端把页面回传时,ASP.NET分析回传的窗体属性,并赋给控件对应的值。当然这些全部是由ASP.NET负责的。uViewState重要一点就是页面刷新或是重新载入就无效了。这是其与Session,Application等的区别)。 u自定义状态量的保存和使用: ViewState.Add(Test, VariableName); /定义状态变量Test并保存值/分析使用状态 if (ViewStateTest != null) Variable = (VariableType)Vie

59、wStateTest;ViewState对象的详细说明请参阅以下备注页内容及相关资料!57575.3.3 5.3.3 ViewStateViewState对象对象u禁用禁用ViewState,ViewState,EnableViewStateEnableViewState属性设置属性设置默认情况下,ViewState是被启用的,比如提交表单后,表单中输入的值会自动保留。但是如果不需要保留,也可以将其禁用,这样可以节省资源。下面三种方式就可以分别禁用某一个控件、某一个页面和整个应用程序的ViewState。q 控件禁用:将控件的EnableViewState属性设置为false;q 页面禁用:在

60、页面的Page指令中添加EnableViewState=false;q 应用程序禁用:在Web.Config文件中添加 程序代码 58585.3.3 5.3.3 ViewStateViewState对象对象u EnableViewStateEnableViewState属性说明属性说明 ASP.NET2.0引入了viewstate的机制,在服务器端保存网页各个控件及页面的状态,这其中包括各个控件在页面上的布局和各自的属性。具体来讲,是保存在_VIEWSTATE 属性(观察Aspx页面的html源代码可见)中,其值是一长串字符,类型为hidden。 当用户对页面进行相关操作的时候,状态值发生改变

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论