软件学院

第四章 HTML 控件和 Web 服务器控件

褚龙现chulongxian@126.com

软件学院

回顾内容

HTML 控件特点HTML 控件属性

软件学院

回顾 -- HTML 控件

HTML 控件外观上与普通的 HTML标记很相似，由 HTML 标记衍生而来，属于 System.Web.UI.HtmlControls 命名空间，并在 ASP.NET 页中声明为一个由 runat=“server” 属性标记的 HTML 元素。

软件学院

回顾 -- HTML 控件的优点 HTML 标记加上 runat=server 属性后，

即可变为 HTML 控件。 HTML 控件将 HTML 标记对象化，其属

性可以由程序直接控制。 HTML 控件支持事件处理，可以以事件

触发方式来编写程序。

软件学院

回顾– HTML 控件常用属性

Style 属性 Attributes 属性 Visible 属性 Disabled 属性 InnerHtml 属性 InnerText 属性

软件学院

1 Style 属性 Style 属性可以设定的样式：样式名称 说明 设定值Background-Color 背景色 RDB 或指定颜色Color 前景色 RDB 或指定颜色Font-Family 字型 标楷体Font-size 字体大小 20pt

Font-Style 斜体 Italic 或 Normal

Font-Weight 粗体 Bold 或 Normal

Text-Decoration 效果Text-Transform 转大小写

软件学院

2 Attributes 属性 Attributes 属性使用注意事项

对于有些控件指定的属性不合法指定的属性不是对应 HTML 标记所

支持的

软件学院

教学目标

掌握常用 HTML 控件

软件学院

教学重难点

重点HTML 控件应用

难点HTML 控件各个属性

软件学院

4.2 基本 HTML 控件

HtmlTextArea 控件 HtmlTable 控件 HtmlImage 控件 HtmlSelect 控件 HtmlInput 控件

软件学院

4.2.1 HtmlTextArea 控件 该控件可以在 Web 页上创建多行文

本框。多行文本框的高度和宽度可以通过 rows 和 cols 属性控制，设置或获取多行文本框的文本内容，使用的是 Value 属性。

软件学院

4.2.2 HtmlTable 控件 该控件用来生成表。可以使用 Html

Table 、 HtmlTableRow 、 HtmlTableCell 控件来自由地控制表格的行、列数。将创建好的行添加到表的 Rows 集合中，将创建好的单元格，添加到行的 Cells 集合中，形成表。

软件学院

4.2.3 HtmlImage 控件 实用 HtmlImage 控件可以在 Web

页上显示图像，并且可以通过编程动态控制显示图像的大小、图像相对于其他控件的对齐方式以及更改图像本身。

软件学院

4.2.3 HtmlImage 控件 HtmlImage 控件的主要属性有：

Src 属性：图像文件Align 属性：对齐方式Alt 属性：无法加载时，显示文字Border 属性：图像边界宽度Height 、 Width 属性：长、宽值

软件学院

4.2.4 HtmlSelect 控件 使用该控件创建选择框，通过将 <o

ption> 元素放在开始和结束 <select> 标记之间来指定控件中的项列表。

ListItem 的 Text 属性用于指定显示的文本， Value 属性用于将一个不同于文本的值与该项关联。

软件学院

4.2.4 HtmlSelect 控件 Size 属性用于控制该控件的高度，

Multiple 属性用于控制该控件是否可以多选。

SelectedIndex 属性用于获取选定项的索引，可以从 Items 集合中检索该项。

软件学院

4.2.5 HtmlInput 控件 HtmlInput 控件根据 Type 属性的设

定产生不同种类的控件。HtmlInputButton 控件HtmlInputCheckBox 控件HtmlInputText 控件HtmlInputHidden 控件HtmlInputRadioButton 控件HtmlInputFile 控件

软件学院

1 HtmlInputButton 控件 根据 type 属性的不同设置，可以创建

命令按钮、提交按钮和重置按钮。 用户单击 HtmlInputButton 控件时，

嵌有该控件的窗体输入被送到服务器并得到处理，然后将处理结果发送回请求浏览器。

重置按钮不支持 ServerClick 事件。

软件学院

2 HtmlInputCheckBox 控件 单击该控件时，不会向服务器回送。

当使用回送服务器控件时，复选框的状态被发送到服务器进行处理。

Checked 属性用于获取或设置是否选中该复选框。

OnServerChange 方法只有提交页面同时当更改了选择状态时发生。

软件学院

3 HtmlInputText 控件 单行文本框，当 type 属性为 passwor

d 时屏蔽文本框内容。 使用 MaxLength 、 Size 和 Value 属

性，可以控制文本框输入的最大字符数、文本框宽度和文本框的内容。

软件学院

4 HtmlInputHidden 控件 此控件是窗体的一部分，但永远不在窗

体上显示。此控件通常与 HtmlInputButton 和 HtmlInputText 控件一起使用，以在对服务器的发送之间存储信息。

软件学院

5 HtmlInputRadioButton 控件

此控件在 Web 页上创建单选按钮。有两个重要属性。Name 属性：用于获取或设置 HtmlInputRadio

Button 关联的组的名称，多个控件设置同一个name 属性，可以实现互相排斥功能。

Checked 属性：获取或设置单选按钮是否被选中。

软件学院

5 HtmlInputRadioButton 控件

此控件不会自动向服务器回送。必须依赖使用某个按钮控件来回送到服务器。

ServerChange 事件只为更改成选中状态的单选按钮引发。

软件学院

6 HtmlInputFile 控件 HtmlInputFile 可以用来向服务器端上传

文件。 要使得文件上载能够成功，需要满足：

1. 控件必须出现在 Form 元素中2. 必须为该控件指定 Name 标签属性的值3.form 元素的 method 属性值必须为 post4.form 元素的 enctype 标签属性值为 multi

part/form-data

软件学院

下次课内容

Web服务器控件