网站建设l临沂,ppt免费下载完整版免费下载,新沂网站开发,湖南营销型网站建设报价文章目录 前言16.1 HTML概述16.1.1 HTML的基本概念16.1.2 HTML语言的基本元素16.1.3 格式设置16.1.4 超级链接16.1.5 图像16.1.6 表格16.1.7 框架16.1.8 表单 16.2 ASP.NET Web Forms的组织16.2.1 认识ASP.NET16.2.2 Web Forms的组织 16.3 Web服务器控件16.3.1 使用Label和Text… 文章目录 前言16.1 HTML概述16.1.1 HTML的基本概念16.1.2 HTML语言的基本元素16.1.3 格式设置16.1.4 超级链接16.1.5 图像16.1.6 表格16.1.7 框架16.1.8 表单 16.2 ASP.NET Web Forms的组织16.2.1 认识ASP.NET16.2.2 Web Forms的组织 16.3 Web服务器控件16.3.1 使用Label和TextBox控件16.3.2 使用Button控件16.3.3 其他控件介绍 16.4 数据验证控件16.4.1 数据验证机制介绍16.4.2 验证输入控件RequiredFieldValidator16.4.3 比较验证控件CompareValidator16.4.4 范围验证控件RangeValidator16.4.5 正则表达式验证控件RegularExpressionValidator16.4.6 用户自定义验证控件CustomValidator16.4.7 汇总显示验证控件ValidatorSummary16.4.8 数据验证控件综合使用 16.5 小结 前言
ASP.NET(Active Server Page.NET)提供了强大的Web开发功能C#是ASP.NET技术支持的语言之一。 C#不仅提供了强大的窗体应用程序和命令行应用程序的开发支持还支持B/S模式的Web应用开发。
ASP.NET是.NET Framework的一部分在通过HTTP请求建立文档时它可以在Web服务器上动态创建文档。 该文档主要是指HTML文档所以了解HTML语法也是十分重要的。
本章主要内容如下
HTML文件的组成ASP.NET的开发环境和配置常用的Web服务器控件数据验证控件的使用 16.1 HTML概述
Web开发的基础知识HTML语言。
这些都是网页编程的基础。
HMTL的应用就是对网页内容的排版。
16.1.1 HTML的基本概念
HTML–Hypertext Markup Language。 超文本标记语言。 用于制作网页。 之所以“超”是不仅限于文本内容可以加入图片、声音、动画、影视等多种内容。
优点在浏览器运行时有统一规则和标准。
第一个HTML程序
新建记事本文件文件名后缀修改为.html
加入HTML代码
HTMLHEAD
TITLE/TITLE
/HEADBODYCENTER
HHELLO C#/H
BR
HR
FONT SIZE7 COLORREDMY FIRST WEB/FONT
/CENTER/BODY/HTML双击使用浏览器打开运行
16.1.2 HTML语言的基本元素
HTML/HTML 标记一个文档的开始、结束。HEAD/HEAD 标记文档的开头部分。 该标记中可以使用title/title和script/scriptBODY/BODY 文档头部内容结束后开始的文档的内容主体部分。 BODY有以下属性 Bgcolor:设置主体背景颜色。 Text:设置文本颜色。 Link:设置链接颜色。 Vlink:设置已使用链接颜色。 Alink:设置正在被击中的链接的颜色。TITLE/TITLE 放在Head中使用。用来修改浏览器窗口标题栏信息。
使用上面的HTML语言的基本元素继续使用记事本创建一个简单文档.html文件
HTMLHEAD
TITLE简单文档/TITLE
/HEADBODY bgcolor green text white
p简单的一个文档/p
/BODY/HTML在浏览器中打开的结果
16.1.3 格式设置
HTML语言中用来设置文字样式的标记。 p/p标记一个段落。 可以用align属性说明对齐方式left/cemter/right br回车 在段落中小回车在段落间大回车。
范例
HTML
HEAD
TITLE区别/TITLE
/HEADBODY bgcolor LightBlue, text DarkOrange
p这是一个段落/pbr
p这是另一个段落/p
br
br
br
p第三个段落br/p
p第四个段落/p
br
br
br
p第五个段落第六个段落br第七个段落/p/BODY/HTMLdivdiv文档分节或格式化表。 用法与p/p类似。 span/span 在行内控制特定内容的显示。 将要设置格式的文字使用此标记包围然后设置格式。
范例
HTML
HEAD
TITLE区别/TITLE
/HEADBODY bgcolor LightBlue, text DarkOrange div故事的小黄花在出生那年就飘着div
div童年的荡秋千随记忆一直晃到现在div
div吹着前奏span style font-size:40px望着天空/span我想起花瓣试着飘落/div/BODY/HTML结果 16.1.4 超级链接
a href链接目标的位置链接的名字/a 超链接用来实现页面的联系和转换。
链接到同一站点内的文档
a hrefmyhtml.htm/a链接到其他站点内的文档
a hrefhttp://www.myweb.edu.cn示例/aE-mail链接代码如下
a hrefmailto:mymail126.com示例/a页面内部链接。首先给页面中需要链接的地方命名
a namemyword/a在页面调用的地方设置指向已经命名的链接a href#mywork转到/a当点击“转到”这个链接时就从当前页的当前位置转到标记名为myword的位置。范例
HTMLHEAD
/HEADBODY bgcolor LightGreen, text White
a hrefmyhtml.htm本站页面链接示例/a
a hrefhttp://www.web.edu.cn外部站页面链接/a
a hrefmailto:mymail:mymail126.com/aa namemyword/a
center第二章 HTMLbrbrhr/centerbrbr
2.1 基本结构brbrbrbr
2.2 标记格式brbrbrbr
/hr
brbrbrbrbrbr
a href#myword转到/a
/BODY/HTML浏览器显示结果
16.1.5 图像 img 标记显示网页中图像。 一些属性
属性说明src图形文件路径、图形文件名。图与当前HTML文档在同一目录src pic.gif。图在HTML文档文件夹的子文件夹src images/pic.gif。图在HTML文档所在文件夹的上层目录src ../web/pic.gifalt图片没完全加载时鼠标放在图片上显示的文字Height,Width图像的宽度和高度像素为单位。 可以先建小图在浏览器上按照比例放大border边框线宽度0表示无边框
示例
HTMLHEAD
title图片显示/title
/HEADBODYimg srcpicEarth.gif alt地球 stylewidth:300px;height:auto;/BODY/HTML运行结果
16.1.6 表格
表格对网页意义重大因为能够对页面排版。
table/table 创建一个表格。 其属性
属性说明bgcolor表格背景色border边框宽度默认0bordercolor边框颜色bordercolorlight边框亮部分颜色bordercolordark边框暗部分颜色cellsapcing表格单元格之间空隙大小cellpadding表格单元格边框与其中内容的间距大小width表格宽度
tr/tr 表格的一行 属性
属性说明align单元格中文字的水平对齐方式valign单元格中文字的垂直对齐方式
td/td 标记表格中除标题外所有文字的格式 属性
属性说明colspan可以设置跨多列的单元格rowspan可以设置跨多行的单元格
th/th 标记表格标题单元格的文字格式通常是黑体居中 示例代码
HTMLHEAD
TITLE表格/TITLE
/HEADBODYTABLE bgcolorlighblue bordercolorwhite border1 width100% cellspacing5
tr align“left”valigntop
td表格1-1/td
td表格1-2/td
td表格1-3/td
td表格1-4/td
td表格1-5/td
td表格1-6/td
/trtr
td表格2-1/td
td表格2-2/td
td表格2-3/td
td表格2-4/td
td表格2-5/td
td表格2-6/td
/trtr
td表格3-1/td
td表格3-2/td
td表格3-3/td
td表格3-4/td
td表格3-5/td
td表格3-6/td
/tr
/TABLE/BODYHTML运行结果
16.1.7 框架
框架的标记为Frame,一个框架内可以有多个HTML文件。多个框架可以同时显示在一个浏览器中。
通常的设计格局是在一个框架中放置目录另一个框架中放置HTML文件。
frameset/frameset 标记对可以放在body/body标记对的外边也可以嵌在其他框架文中。可以嵌套使用。
该标记对有两个属性rows和cols使用该标记时至少选择两个属性之一。
属性说明rows规定主文档中各个框架的行定位百分数、绝对像素值、星号*cols规定主文档中各个框架的列定位百分数、绝对像素值、星号*
*代表没被说明的空间如果同一个属性中出现多个星号则将剩下的没被说明的控件平均分配。同时所有的框架按照rows和cols的值从左往右从上到下排列。
frame 标记放在frameset/frameset之间用来定义一个具体的框架。 属性有两个属性都必须赋值。
属性说明src此框架的源HTML文件名浏览器显示此框架src指定的HTML文件name此框架名字用来供超文本连接标记a href target/a中的target属性指定链接的HTML文件显示在哪个框架中
noframesets/noframesets 用在frameset/frameset标记对之间用于在不支持框架的浏览器中显示文本或图像信息。 此标记对之间必须先紧跟body/body标记对然后才可以使用以前讲过的其他标记。
代码示例 07 框架.html
HTMLHEAD
TITLE框架/TITLE
/HEADframeset col25%,*frame src07-1 框架-left.html scrollingno nameleftframe src07-2 框架-page1.html scrollingauto namemainnoframes
BODY
p你的浏览器不支持此框架/p
/BODY
/noframes/frameset/HTML07-1 框架-left.html
HTMLHEAD
TITLE导航/TITLE
/HEADBODY
p导航/p
pa href07-2 框架-page1.html targetMain第一页/a/p
pa href07-3 框架-page2.html targetMain第二页/a/p
/BODY/HTML07-2 框架-page1.html
HTMLHEAD
TITLE第一页/TITLE
/HEADBODY
p这是第一页/p
/BODY/HTML07-3 框架-page2.html
HTMLHEAD
TITLE第二页/TITLE
/HEADBODY
p这是第二页/p
/BODY/HTML运行结果 将四个文件放在同一个文件夹内运行 07 框架.html进入导航页面。 点击第一页链接进入第一个页面 点击第二页链接进入第二个页面。 如果浏览器不支持框架就会显示noframes/noframes中的内容“你的浏览器不支持框架”
总结这样使用框架实现了页面之间的跳转。
16.1.8 表单
表单是用来输入信息的区域。
是使网页具有交互功能的关键组件。
利用表单可以接收用户输入将数据发送给服务器服务器接收并处理这些信息后动态产生网页返回给页面。
1.文本框
类型格式单行文本框input typetext name控件名称 value传出值多行文本框textarea row行数 cols列数 name控件名称/textarea密码框input typepassword name控件名称 value传出值
2.按钮
类型格式普通按钮input typebutton name控件名称 value显示值提交按钮input typesubmit name控件名称 value显示值重置按钮input typereset name控件名称 value显示值
3.单选按钮
类型格式单选按钮input typeradio name控件名称 value传出值
4.复选框
类型格式单选按钮input typecheckbox name控件名称 value传出值
5.下拉列表框 格式如下
select
option选项1/option
option选项2/option
option选项3/option
/select完整表单示例代码
HTMLHEAD
TITLE表单/TITLE
/HEADBODYform mehtodpost
table
tr
td用户名/td
tdinput nameUserName typetext size10/td
/trtr
td密 码/td
tdinput namepassword1 typepassword size10/td
/trtr
td选 择/td
td
select namemyselect multiple size4
option value1 selected选项1/option
option value2选项2/option
option value3选项3/option
option value4选项4/option
/select
/td
/trtr
td性 别/td
tdinput namemyradio typeradio valueM男/td
tdinput namemyradio typeradio valueF女/td
/trtr
td/td
tdinput namemysubmit typesubmit value确认 size10/td
tdinput namemyreset typereset value重置 size10/td
td/td
/tr/table
/form/BODY/HTML运行结果
16.2 ASP.NET Web Forms的组织
ASP.NET之前出现的ASP给Web开发带来一次革新ASP能够直接将代码嵌入HTML网页。使得Web页面变得简单。并且能够通过内置的组件实现强大的功能例如ActiveX Data Objects(ADO)能够简单建立动态页面。
16.2.1 认识ASP.NET
ASP.NET是微软推出的新一代Active Server Pages。是.NET架构的一部分新架构使编程变得简单。 接下来介绍ASP.NET应用程序开发过程中用到的控件及其他知识。 ASP.NET的技术架构图。
16.2.2 Web Forms的组织
ASP.NET窗体页是结构化的网页即网页的表现代码和程序代码分开。 在ASP.NET技术中使表现代码和程序代码分开的技术可以分为两类
CodeBehind技术不使用CodeBehind技术 CodeBehind技术简单解释为将表现代码和程序代码放在两个文件夹中。虽然采用CodeBehind技术编写程序代码所需文件数量增多同时每个文件中的代码也增多但开发人员要做的工作却大大减少而且方便多个程序员分工合作。 下面演示不使用CodeBehind和使用CodeBehind技术编写程序的过程。
不使用CodeBehind技术代码 程序代码都在script/script之间表现代码与程序代码分离但是都在一个文件内。首选在Web页面.aspx中放了一个ID为mylabel的Label服务端控件在页面的Page_Load事件处理程序中给该控件的text属性赋值使其显示在页面上。
HTMLHEAD
TITLE不使用CodeBehind技术/TITLE
script
void page_Load(Object Src, EventArgs)
{mylabel.Text不使用CodeBehind技术;
}
/script
/HEADBODY
asp:label idmylabel runatserver/
/BODY
/HTML运行结果
使用CodeBehind技术的代码 其中从分界线之前都是放在页面.aspx页面中分界线后面的代码放在.aspx.cs后台代码中。
HTMLHEAD
TITLE使用CodeBehind技术/TITLE
/HEADBODY
asp:label idmylabel runatserver
/BODY///以下是后台代码
using System;
......
public partical class _Default : System.Web.UI.Page
{protected void Page_Load(){this.mylabel.Text 使用CodeBehind技术;}
}
/HTML为了更好地说明使用CodeBehind技术即表现代码和程序代码分离的例子在Visual Studio 中新建一个Web Page。步骤如下
1.新建ASP.NET Web应用程序 2.选择空白页 3.Web应用项目建好了 4.在这个项目鼠标选中右键添加新建项Web窗体 5.在web.aspx表现页面中加入一个asp服务器控件label设置ID为mylabel 6.点开窗体文件夹找到后缀为.aspx.cs的窗体后台代码文件双击进入 7.出现窗体页面的_Load事件后台代码 8.我们在这个Load中对在表现页面中定义的服务器控件mylabel进行赋值点击浏览器运行 9.在浏览器中的运行结果两个文件.aspx和.aspx.cs文件很好地体现了表现代码和程序后台代码分离的CodeBehind技术
16.3 Web服务器控件
ASP.NET提供了一系列服务器控件。增强了ASP.NET的功能同时将一些功能实现封装让控件完成。
接下来介绍一些在Web窗体页中使用的基本服务器控件。
16.3.1 使用Label和TextBox控件 运行结果
16.3.2 使用Button控件 单击按钮后文字内容由初始化状态改变成新的文字。 与button类似控件
控件说明LinkButton显示作为超链接按钮 text属性设置按钮显示文字ImageButton显示图像的按钮 ImageUrl设置按钮上图像的四肢。AlternativeText用于定义在浏览器上不支持图片时显示的文字
16.3.3 其他控件介绍
其他控件都在工具箱中可以拖出来一一尝试使用。 下面对集中常用的服务器控件做个总结
Web服务器控件使用说明DropDownList控件单一选择的下拉列表控件。BorderColor/BorderStyle/BorderWidth设置边框样式。AutoPostBack是否在选择后自动发给服务器true/falseListBox控件单项或多项选择的下拉列表控件Rows指定控件高度若要启动多项选择SelectionMode属性设置为Mutiple如果多项要确定索引CheckBox和CheckBoxList控件选择项。单项或多选。Checked属性确定是否已选。RepeatDirection属性设置控件是垂直还是水平。RepeatColumns属性设置CeckBoxList中显示的列数RadioButton和RadioButtonList控件单选或多选 Groupname属性Image控件在Web页面上显示图像通过ImageUrl属性选择要显示的图片注意要选择的图片提前家在卖资源文件夹中Table控件Web窗体上显示表格Caption属性设置标题TableRow修改Rows属性
16.4 数据验证控件
用户在Web窗体中输入的数据对于程序开发来说数据的正确性十分重要。需要数据验证控件。数据验证控件如果放在客户端有兼容性问题ASP.NET中使用服务器数据验证控件能提供易用且功能强大的方法来检验输入窗体中的数据有无错误并在必要时向用户显示消息。
16.4.1 数据验证机制介绍
验证控件可以像其他控件一样加入到Web窗体页。不同的验证控件用于特定的验证类型多个验证控件可以附加到一个输入控件。这里介绍6中数据验证控件。
控件说明RequiredValidator必须输入验证CompareValidator比较限制验证RangeValidator范围限制栏验证RegularExpressionValidator特殊规则限制栏验证CustomValidator自定义数据栏验证ValidationSummary汇集数据验证消息
在处理用户的输入时Web窗体页框架将用户的输入传递给关联的验证控件。验证控件测试用户的输入并设置属性以指示输入是否通过了验证测试。处理完所有的验证控件后设置页上的IsValid属性。如果有任何控件显示验证检查失败则整页设置将无效。如果验证控件有错误则错误信息可由该验证控件显示在页面中或者显示在页面上其他地方的ValidationSummary控件中。当页面的IsValid属性设置为false时显示ValidationSummary,它会轮询页面上每个验证控件并聚合每个控件公开的文本信息。
可验证的Web服务器控件
控件控件的属性TextBoxTextListBoxSelectedItem.ValueDropDownListSelectedItem.ValueRadioButtonListSelectedItem.Value
16.4.2 验证输入控件RequiredFieldValidator
16.4.3 比较验证控件CompareValidator
16.4.4 范围验证控件RangeValidator
16.4.5 正则表达式验证控件RegularExpressionValidator
16.4.6 用户自定义验证控件CustomValidator
16.4.7 汇总显示验证控件ValidatorSummary
16.4.8 数据验证控件综合使用
16.5 小结
ASP.NET是C#应用程序的另一个重要方面其提供了一个统一的Web开发模型同时也是一种新的编程模型和结构。该类程序可生成伸缩性和稳定性更好的应用程序并提供了更好的环境保护。
本章从Web基础知识入手首先介绍了HTML语言接着介绍了ASP.NET的基本控件。有了这些基本的知识读者即可应用ASP.NET技术编写部分实用的网站应用程序。
