,ASP程序设计,1
第 2章 HTML基础
2.1 HTML语言
2.2 HTML文档格式处理
2.3 文本风格处理
2.4 列表处理
2.5 加入多媒体与超级链接
2.6 制作表格
2.7 制作表单
2.8 框架结构
2.9 CSS基础
,ASP程序设计,2
2.1 HTML语言
2.1.1 HTML概述
2.1.2 HTML文档的结构
2.1.3 制作 HTML文件的步骤
,ASP程序设计,3
2.1.1 HTML概述
HTML是 Hyper Text Markup Language的缩写，直译为 超文本标记语言,用来编辑万维网页面。 HTML语言有 2.0,3.0,3.2,4.0等 几种版本,目前被广泛使用的是 4.0版本 。
HTML是一种 纯文本语言,也就是说，
HTML代码在运行时不用事先编译成为二进制代码，而是直接通过网页 浏览器逐行解释 执行。
所以,HTML代码用一般的文本编辑器就可以编写，保存时只要把代码文件存为,htm
或,html即可。
,ASP程序设计,4
2.1.2 HTML文档的结构
1,HTML文档标记格式,<HTML>… </HTML>
标志文件开始和结尾的标记 。
2,HTML文件头标记格式,<HEAD>… </HEAD>
用于包含文件的基本信息 。
3,HTML文件主体标记格式,<BODY>… </BODY>
文件主体标记 。
,ASP程序设计,5
2.1.2 HTML文档的结构
<HTML>
<HEAD>
标题部分
</HEAD>
<BODY>
正文部分
</BODY>
</HTML>
每一个用尖括号,<” 和,>”
括起来的部分称为一个标记,每一个标记都必须有一个标记名称来作为该标记的唯一标识 。 绝大部分的标记都有其相关属性及属性值,取值可以用双引号括起来 (也可以不用 )
大部分的标记都是成对出现的,
这类标记称为包容标记 。 个别标记是单独出现的,这类标记称为空标记 。 需要说明的是,HTML语言是不区分大小写的
,ASP程序设计,6
2.1.2 HTML文档的结构
<HTML>
<HEAD>
<TITLE>这里显示标题信息 </TITLE>
</HEAD>
<BODY>
<P>这里是正文部分。 </P>
</BODY>
</HTML>
,ASP程序设计,7
2.1.3 制作 HTML文件的步骤页面设计编写代码预览测试上传发布不满意
,ASP程序设计,8
2.2 HTML文档格式处理
2.2.1 <BODY>属性
2.2.2 文档编辑风格
,ASP程序设计,9
2.2.1 <BODY>属性
background属性,设置网页背景图片。
bgcolor 属性,设置网页背景。
bgproperties属性,设置背景是否随滚动。
link,vlink,alink属性,设置超级链接。
leftmargin,topmargin属性
margingwidth,marginheight属性
,ASP程序设计,10
2.2.2 文档编辑风格
注意网页色彩的搭配风格统一。
注意网页内容的多少
文字颜色同背景色或背景图片对比强烈。
具有良好的链接性
注意程序的层次性，并添加适当的注释。
,ASP程序设计,11
2.3 文本风格处理
2.3.1 段落格式化
2.3.2 字符的格式化
,ASP程序设计,12
2.3.1 段落格式化
1,强制换行标记符 <BR>
2,段落标记符 <P>… </P>
3,预定义格式标记符 <PRE>… </PRE>
4,标题标记符 <Hn>… </Hn>
,ASP程序设计,13
2.3.1 段落格式化
5,水平线标记符 <HR>
6,分区显示标记符 <DIV>… </DIV>
7,居中标记符 <CENTER>… </CENTER>
8,注释标记符 <!--… -->
,ASP程序设计,14
2.3.2 字符的格式化
size=size：设置文字的大小 。
face=fontstyle：设置字体,如宋体,
黑体,隶书等 。
color=colorvalue：设置文字的颜色 。
1,字体设置标记符 <FONT>… </FONT>
,ASP程序设计,15
2.3.2 字符的格式化
<B>…</B>,将字符设置成粗体。
<I>…</I>,将字符设置成斜体。
<U>…</U>,给字符增加下划线。
<S>…</S>,给字符增加删除线。
<TT>…</TT>,将字符设置成打字机字体。
<SUP>…</SUP>,将字符设置成上标字体。
<SUB>…</SUB>,将字符设置成下标字体。
2,物理字体
,ASP程序设计,16
2.3.2 字符的格式化
<EM>…</EM> 强调文字。
<STRONG>…</STRONG> 字体加重。
<CODE>…</CODE> 显示编程代码。
<SAMP>…</SAMP> 显示示例文字。
<KBD>…</KBD> 显示键盘按键文字。
<SMALL>…</SMALL> 缩小文字。
<BIG>…</BIG> 放大文字。
3,逻辑字体
,ASP程序设计,17
2.4 列表处理
2.4.1 定义列表
2.4.2 有序列表
2.4.3 无序列表
,ASP程序设计,18
2.4.1 定义列表定义列表 格式为：
<DL>
<DT>…</DT>
<DD>…</DD>
<DT>…</DT>
<DD>…</DD>
…
</DL>
<DL>… </DL>用于指定一个定义列表
<DT>… </DT>用于指定一个需要解释的名词或术语
< DD>… </DD> 用于指定名词或术语的解释
,ASP程序设计,19
2.4.2 有序列表所有列表项 都用 有序数字 或 有序字母 在列表项的前面加上着重符号进行编号 。
<OL type="符号类型 ">
<LI type="符号类型 ">…</LI>
<LI type="符号类型 ">…</LI>
…
</OL>
<OL>…</OL>用于定义一个有序列表
<LI>…</LI>用于定义一个列表项
<OL>和 <LI>都具有,type”属性,用于指定列表项着重符号的类型 。
,ASP程序设计,20
2.4.3 无序列表列表项 前面的着重符号 没有进行编号 。
其 格式 为：
<UL type="符号类型 ">
<LI type="符号类型 ">…</LI>
<LI type="符号类型 ">…</LI>
…
</UL>
<UL>… </UL>用于定义一个无序列表
<LI>… </LI>用于定义一个列表项
<UL>和 <LI>都具有,type”属性,用于指定列表项着重符号的类型 。
,ASP程序设计,21
2.5 加入多媒体与超级链接
2.5.1 加入多媒体
2.5.2 加入超级链接
,ASP程序设计,22
2.5.1 加入多媒体
图像一般以 *.GIF（ 包括 GIF动画）、
*.JPEG,*.PNG格式的文件最为常见
插入图像标记符 <IMG>。
src=URL
alt=text
align=alignstyle
1,加入图像
,ASP程序设计,23
2.5.1 加入多媒体
是在 HTML代码中的 <HEAD>… </HEAD>之间加入背景音乐标记符 <BGSOUND>。
2,加入背景音乐
在 HTML代码中的 <BODY>… </BODY>之间加入嵌入标记符 <EMBED>… </EMBED>。
,ASP程序设计,24
2.5.1 加入多媒体
通过 <IMG>标记符来加入视频。属性 src
的值与插入图像的不同。
3,加入视频
在 HTML代码中的 <BODY>… </BODY>之间加入嵌入标记符 <EMBED>… </EMBED>。 属性 src的值与插入背景音乐的不同。
,ASP程序设计,25
2.5.1 加入多媒体
在 HTML代码中的 <BODY>… </BODY>之间加入嵌入标记符 <EMBED>… </EMBED>,但是 属性 有所不同。
4,加入动画
在 HTML代码中的 <BODY>… </BODY>之间加入对象标记符 <OBJECT>… </OBJECT>。
,ASP程序设计,26
2.5.2 加入超级链接在 HTML中，通过标记符 <A>… </A>来加入超级链接。 文字或图片 作为 超链接源 。
属性,
href=URL
target=targetmode
name=anchorname
,ASP程序设计,27
2.6 制作表格表格 是在设计网页时经常用到的一个重要元素，它不仅可以把文字和图片等内容按照行和列排列 起来，使内容更加清晰、
工整，而且还可以用来建立网页的框架和模板 。
,ASP程序设计,28
2.6 制作表格
2.6.1 表格的结构
2.6.2 创建表格
2.6.3 定义表格标题
2.6.4 定制表格
,ASP程序设计,29
2.6.1 表格结构表格 的结构层次分明。
单元格 （ TableData） 组成表格的最小单位。
多个单元格构成一 行 （ TableRow）。
多行构成一个 表格 （ Table）。
表格的 表头 一般会加上一个标题
（ Caption）,以概括表格的主要内容。
,ASP程序设计,30
2.6.1 表格结构
<TABLE>
<CAPTION>…</CAPTION>
<TR>
<TD>…</TD> …
</TR>
<TR>
<TD>…</TD> …
</TR>
…
</TABLE>
表头标题单元格行
,ASP程序设计,31
2.6.2 创建表格
Border边框 属性 的取值为非负整数，取值为,0” 表示表格边框不可见 。
cellspacing是指相邻单元格之间的距离。
cellpadding是指单元格所含内容和单元格边沿之间的距离。
<TABLE>… </TABLE>用于创建一个表格
,ASP程序设计,32
2.6.3 定义表格标题表格标题标记符
<CAPTION>…</CAPTION>
用于定义表格的标题，位于 <TABLE>和
<TR>之间。
表格的标题 显示在表格的表头中部，起 概括表格内容 的作用。
,ASP程序设计,33
2.6.4 定制表格
Bgcolor,设置一行的背景颜色 。
Background,设置一行的背景图片 。
Bordercolor,设置一行的边框颜色 。
Align,设置一行的水平对齐方式
Valign,设置一行的垂直对齐方式 。
1,行标记符 <TR>… </TR>
,ASP程序设计,34
2.6.4 定制表格
rowspan=num
设置单元格所跨越的行数,默认为 1
colspan=num
设置单元格所跨越的列数,默认为 1
width=size
设置单元格的宽度,默认为自适应大小
height=size
设置单元格的高度,默认为自适应大小
2,单元格标记符 <TD>… </TD>
,ASP程序设计,35
2.7 制作表单表单是用户与 Web服务器进行信息 交互 的主要手段 。
在 Web上，通过填写表单并提交的方式完成用户信息的收集并将其 传递 给 Web服务器。
,ASP程序设计,36
2.7 制作表单
2.7.1 表单的结构
2.7.2 表单中常用的表单元素
,ASP程序设计,37
2.7.1 表单的结构表单的格式 如下：
<FORM>
表单元素 1
表单元素 2
…
提交按钮
</FORM>
（ 1） action 属性指定的处理数据的程序 。
（ 2 ） method 属性指定了发送表单数据的方法 。
,ASP程序设计,38
2.7.2 表单中常用的表单元素
1,文本输入标记符 <INPUT>
<INPUT>标记符因其,type”属性的取值不同而有多种显示形式 。
（ 1） 单行文本框,<INPUTtype=“text”>
（ 2） 输入密码框,<INPUT type="password">
（ 3） 隐藏域,<INPUT type="hidden">
（ 4） 复选框,<INPUT type="checkbox">
（ 5） 单选框,<INPUT type="radio">
,ASP程序设计,39
2.7.2 表单中常用的表单元素
（ 6）图像域,<INPUT type="image">
（ 7）文件字段域,<INPUT type="file">
（ 8）提交按钮,<INPUT type="submit">
（ 9）重置按钮,<INPUT type="reset">
（ 10）普通按钮,<INPUT type="button">
,ASP程序设计,40
2.7.2 表单中常用的表单元素
2,多行文本框标记符
<TEXTAERA>… </TEXTAREA>
用于输入诸如个人简历、文章资料等信息量相对较多的文本信息。
name=areaname,设置多行文本框的名称 。
rows=num,设置多行文本框的行数 。
cols=num,设置多行文本框的列数 。
,ASP程序设计,41
2.7.2 表单中常用的表单元素
3,选择列表提供一张事先设计好的可供选择的列表,
用户只能选择而 不能手工输入 信息 。
<SELECT>
<OPTION>选项一 </OPTION>
<OPTION>选项二 </OPTION>
…
</SELECT>
,ASP程序设计,42
2.8 框架结构在设计网页布局时，除了使用无边框表格外，还可以使用专门用于 布局的框架 。框架可以 物理 上将一个页面 分成若干区域,每个区域可以载入一个网页。
,ASP程序设计,43
2.8 框架结构
2.8.1 框架结构的文件格式
2.8.2 框架结构标记的使用
2.8.3 FRAME标记
2.8.4 与框架相关的 TARGET属性
,ASP程序设计,44
2.8.1 框架结构的文件格式具体格式如下：
<HTML>
<HEAD>…</HEAD>
<FRAMESET>
<FRAME>
…
<FRAME>
…
</FRAMESET>
</HTML>
注意：
在文档中,若使用了
<FRAMESET>,就不应该有 <BODY>标记 。
老版本的浏览器可能不支持框架结构 。
,ASP程序设计,45
2.8.2 框架结构标记的使用
<FRAMESET>…</FRAMESET>
rows=size,设置多重框架的高度 。
cols=size,设置多重框架的宽度 。
frameborder=isdisplayborder
设置是否显示框架边框 。
border=num,设置框架的边框大小 。
,ASP程序设计,46
2.8.3 FRAME标记
src=URL,设置要载入的文件的路径和名称 。
name=framename,设置子窗口的名称
marginwidth=size：
设置显示内容和窗口左右边界的距离 。
marginheight=size：
设置显示内容和窗口上下边界的距离 。
scrolling=scrollingstyle：
设置子窗口是否使用滚动条
Noresize,设置是否能调整窗口大小 。
,ASP程序设计,47
2.8.4 与框架相关的 TARGET
当用户单击该链接时，链接的网页 默认会在原来的子窗口打开 。
如果要 指定在某个子窗口打开,就要使用
TARGET属性,将其取值设置为指定子窗口的名称，可以实现 链接 的 HTML文件 在指定子窗口 中打开。
,ASP程序设计,48
2.9.1 CSS样式简介
CSS（ Cascading Style Sheets,层叠样式表 ），是用来管理网页样式并将样式信息与网页内容分离的一种 标记性语言 。
它提供了 很多的样式定义 方式来辅助
HTML,可以对页面元素的字体、大小、颜色、背景、排列方式、区域尺寸等做到精确地控制。
,ASP程序设计,49
2.9 CSS基础
2.9.1 CSS样式简介
2.9.2 CSS样式表的定义
2.9.3 在 HTML中加入 CSS的方法
,ASP程序设计,50
2.9.2 CSS样式表的定义
1．通过 HTML标记定义属性和属性值之间用,,,隔开，多个属性时，使用,；,进行分隔。
2．用 id属性定义样式表以,#” 开头，属性和属性值写入大括号内。
3．使用 class定义样式表以,,” 开头，属性和属性值写入大括号内。
,ASP程序设计,51
2.9.3 在 HTML中加入 CSS
1．嵌入式样式表
2．内联式样式表
3．外联式样式表
4．输入式样式表
第 2章 HTML基础
2.1 HTML语言
2.2 HTML文档格式处理
2.3 文本风格处理
2.4 列表处理
2.5 加入多媒体与超级链接
2.6 制作表格
2.7 制作表单
2.8 框架结构
2.9 CSS基础
,ASP程序设计,2
2.1 HTML语言
2.1.1 HTML概述
2.1.2 HTML文档的结构
2.1.3 制作 HTML文件的步骤
,ASP程序设计,3
2.1.1 HTML概述
HTML是 Hyper Text Markup Language的缩写，直译为 超文本标记语言,用来编辑万维网页面。 HTML语言有 2.0,3.0,3.2,4.0等 几种版本,目前被广泛使用的是 4.0版本 。
HTML是一种 纯文本语言,也就是说，
HTML代码在运行时不用事先编译成为二进制代码，而是直接通过网页 浏览器逐行解释 执行。
所以,HTML代码用一般的文本编辑器就可以编写，保存时只要把代码文件存为,htm
或,html即可。
,ASP程序设计,4
2.1.2 HTML文档的结构
1,HTML文档标记格式,<HTML>… </HTML>
标志文件开始和结尾的标记 。
2,HTML文件头标记格式,<HEAD>… </HEAD>
用于包含文件的基本信息 。
3,HTML文件主体标记格式,<BODY>… </BODY>
文件主体标记 。
,ASP程序设计,5
2.1.2 HTML文档的结构
<HTML>
<HEAD>
标题部分
</HEAD>
<BODY>
正文部分
</BODY>
</HTML>
每一个用尖括号,<” 和,>”
括起来的部分称为一个标记,每一个标记都必须有一个标记名称来作为该标记的唯一标识 。 绝大部分的标记都有其相关属性及属性值,取值可以用双引号括起来 (也可以不用 )
大部分的标记都是成对出现的,
这类标记称为包容标记 。 个别标记是单独出现的,这类标记称为空标记 。 需要说明的是,HTML语言是不区分大小写的
,ASP程序设计,6
2.1.2 HTML文档的结构
<HTML>
<HEAD>
<TITLE>这里显示标题信息 </TITLE>
</HEAD>
<BODY>
<P>这里是正文部分。 </P>
</BODY>
</HTML>
,ASP程序设计,7
2.1.3 制作 HTML文件的步骤页面设计编写代码预览测试上传发布不满意
,ASP程序设计,8
2.2 HTML文档格式处理
2.2.1 <BODY>属性
2.2.2 文档编辑风格
,ASP程序设计,9
2.2.1 <BODY>属性
background属性,设置网页背景图片。
bgcolor 属性,设置网页背景。
bgproperties属性,设置背景是否随滚动。
link,vlink,alink属性,设置超级链接。
leftmargin,topmargin属性
margingwidth,marginheight属性
,ASP程序设计,10
2.2.2 文档编辑风格
注意网页色彩的搭配风格统一。
注意网页内容的多少
文字颜色同背景色或背景图片对比强烈。
具有良好的链接性
注意程序的层次性，并添加适当的注释。
,ASP程序设计,11
2.3 文本风格处理
2.3.1 段落格式化
2.3.2 字符的格式化
,ASP程序设计,12
2.3.1 段落格式化
1,强制换行标记符 <BR>
2,段落标记符 <P>… </P>
3,预定义格式标记符 <PRE>… </PRE>
4,标题标记符 <Hn>… </Hn>
,ASP程序设计,13
2.3.1 段落格式化
5,水平线标记符 <HR>
6,分区显示标记符 <DIV>… </DIV>
7,居中标记符 <CENTER>… </CENTER>
8,注释标记符 <!--… -->
,ASP程序设计,14
2.3.2 字符的格式化
size=size：设置文字的大小 。
face=fontstyle：设置字体,如宋体,
黑体,隶书等 。
color=colorvalue：设置文字的颜色 。
1,字体设置标记符 <FONT>… </FONT>
,ASP程序设计,15
2.3.2 字符的格式化
<B>…</B>,将字符设置成粗体。
<I>…</I>,将字符设置成斜体。
<U>…</U>,给字符增加下划线。
<S>…</S>,给字符增加删除线。
<TT>…</TT>,将字符设置成打字机字体。
<SUP>…</SUP>,将字符设置成上标字体。
<SUB>…</SUB>,将字符设置成下标字体。
2,物理字体
,ASP程序设计,16
2.3.2 字符的格式化
<EM>…</EM> 强调文字。
<STRONG>…</STRONG> 字体加重。
<CODE>…</CODE> 显示编程代码。
<SAMP>…</SAMP> 显示示例文字。
<KBD>…</KBD> 显示键盘按键文字。
<SMALL>…</SMALL> 缩小文字。
<BIG>…</BIG> 放大文字。
3,逻辑字体
,ASP程序设计,17
2.4 列表处理
2.4.1 定义列表
2.4.2 有序列表
2.4.3 无序列表
,ASP程序设计,18
2.4.1 定义列表定义列表 格式为：
<DL>
<DT>…</DT>
<DD>…</DD>
<DT>…</DT>
<DD>…</DD>
…
</DL>
<DL>… </DL>用于指定一个定义列表
<DT>… </DT>用于指定一个需要解释的名词或术语
< DD>… </DD> 用于指定名词或术语的解释
,ASP程序设计,19
2.4.2 有序列表所有列表项 都用 有序数字 或 有序字母 在列表项的前面加上着重符号进行编号 。
<OL type="符号类型 ">
<LI type="符号类型 ">…</LI>
<LI type="符号类型 ">…</LI>
…
</OL>
<OL>…</OL>用于定义一个有序列表
<LI>…</LI>用于定义一个列表项
<OL>和 <LI>都具有,type”属性,用于指定列表项着重符号的类型 。
,ASP程序设计,20
2.4.3 无序列表列表项 前面的着重符号 没有进行编号 。
其 格式 为：
<UL type="符号类型 ">
<LI type="符号类型 ">…</LI>
<LI type="符号类型 ">…</LI>
…
</UL>
<UL>… </UL>用于定义一个无序列表
<LI>… </LI>用于定义一个列表项
<UL>和 <LI>都具有,type”属性,用于指定列表项着重符号的类型 。
,ASP程序设计,21
2.5 加入多媒体与超级链接
2.5.1 加入多媒体
2.5.2 加入超级链接
,ASP程序设计,22
2.5.1 加入多媒体
图像一般以 *.GIF（ 包括 GIF动画）、
*.JPEG,*.PNG格式的文件最为常见
插入图像标记符 <IMG>。
src=URL
alt=text
align=alignstyle
1,加入图像
,ASP程序设计,23
2.5.1 加入多媒体
是在 HTML代码中的 <HEAD>… </HEAD>之间加入背景音乐标记符 <BGSOUND>。
2,加入背景音乐
在 HTML代码中的 <BODY>… </BODY>之间加入嵌入标记符 <EMBED>… </EMBED>。
,ASP程序设计,24
2.5.1 加入多媒体
通过 <IMG>标记符来加入视频。属性 src
的值与插入图像的不同。
3,加入视频
在 HTML代码中的 <BODY>… </BODY>之间加入嵌入标记符 <EMBED>… </EMBED>。 属性 src的值与插入背景音乐的不同。
,ASP程序设计,25
2.5.1 加入多媒体
在 HTML代码中的 <BODY>… </BODY>之间加入嵌入标记符 <EMBED>… </EMBED>,但是 属性 有所不同。
4,加入动画
在 HTML代码中的 <BODY>… </BODY>之间加入对象标记符 <OBJECT>… </OBJECT>。
,ASP程序设计,26
2.5.2 加入超级链接在 HTML中，通过标记符 <A>… </A>来加入超级链接。 文字或图片 作为 超链接源 。
属性,
href=URL
target=targetmode
name=anchorname
,ASP程序设计,27
2.6 制作表格表格 是在设计网页时经常用到的一个重要元素，它不仅可以把文字和图片等内容按照行和列排列 起来，使内容更加清晰、
工整，而且还可以用来建立网页的框架和模板 。
,ASP程序设计,28
2.6 制作表格
2.6.1 表格的结构
2.6.2 创建表格
2.6.3 定义表格标题
2.6.4 定制表格
,ASP程序设计,29
2.6.1 表格结构表格 的结构层次分明。
单元格 （ TableData） 组成表格的最小单位。
多个单元格构成一 行 （ TableRow）。
多行构成一个 表格 （ Table）。
表格的 表头 一般会加上一个标题
（ Caption）,以概括表格的主要内容。
,ASP程序设计,30
2.6.1 表格结构
<TABLE>
<CAPTION>…</CAPTION>
<TR>
<TD>…</TD> …
</TR>
<TR>
<TD>…</TD> …
</TR>
…
</TABLE>
表头标题单元格行
,ASP程序设计,31
2.6.2 创建表格
Border边框 属性 的取值为非负整数，取值为,0” 表示表格边框不可见 。
cellspacing是指相邻单元格之间的距离。
cellpadding是指单元格所含内容和单元格边沿之间的距离。
<TABLE>… </TABLE>用于创建一个表格
,ASP程序设计,32
2.6.3 定义表格标题表格标题标记符
<CAPTION>…</CAPTION>
用于定义表格的标题，位于 <TABLE>和
<TR>之间。
表格的标题 显示在表格的表头中部，起 概括表格内容 的作用。
,ASP程序设计,33
2.6.4 定制表格
Bgcolor,设置一行的背景颜色 。
Background,设置一行的背景图片 。
Bordercolor,设置一行的边框颜色 。
Align,设置一行的水平对齐方式
Valign,设置一行的垂直对齐方式 。
1,行标记符 <TR>… </TR>
,ASP程序设计,34
2.6.4 定制表格
rowspan=num
设置单元格所跨越的行数,默认为 1
colspan=num
设置单元格所跨越的列数,默认为 1
width=size
设置单元格的宽度,默认为自适应大小
height=size
设置单元格的高度,默认为自适应大小
2,单元格标记符 <TD>… </TD>
,ASP程序设计,35
2.7 制作表单表单是用户与 Web服务器进行信息 交互 的主要手段 。
在 Web上，通过填写表单并提交的方式完成用户信息的收集并将其 传递 给 Web服务器。
,ASP程序设计,36
2.7 制作表单
2.7.1 表单的结构
2.7.2 表单中常用的表单元素
,ASP程序设计,37
2.7.1 表单的结构表单的格式 如下：
<FORM>
表单元素 1
表单元素 2
…
提交按钮
</FORM>
（ 1） action 属性指定的处理数据的程序 。
（ 2 ） method 属性指定了发送表单数据的方法 。
,ASP程序设计,38
2.7.2 表单中常用的表单元素
1,文本输入标记符 <INPUT>
<INPUT>标记符因其,type”属性的取值不同而有多种显示形式 。
（ 1） 单行文本框,<INPUTtype=“text”>
（ 2） 输入密码框,<INPUT type="password">
（ 3） 隐藏域,<INPUT type="hidden">
（ 4） 复选框,<INPUT type="checkbox">
（ 5） 单选框,<INPUT type="radio">
,ASP程序设计,39
2.7.2 表单中常用的表单元素
（ 6）图像域,<INPUT type="image">
（ 7）文件字段域,<INPUT type="file">
（ 8）提交按钮,<INPUT type="submit">
（ 9）重置按钮,<INPUT type="reset">
（ 10）普通按钮,<INPUT type="button">
,ASP程序设计,40
2.7.2 表单中常用的表单元素
2,多行文本框标记符
<TEXTAERA>… </TEXTAREA>
用于输入诸如个人简历、文章资料等信息量相对较多的文本信息。
name=areaname,设置多行文本框的名称 。
rows=num,设置多行文本框的行数 。
cols=num,设置多行文本框的列数 。
,ASP程序设计,41
2.7.2 表单中常用的表单元素
3,选择列表提供一张事先设计好的可供选择的列表,
用户只能选择而 不能手工输入 信息 。
<SELECT>
<OPTION>选项一 </OPTION>
<OPTION>选项二 </OPTION>
…
</SELECT>
,ASP程序设计,42
2.8 框架结构在设计网页布局时，除了使用无边框表格外，还可以使用专门用于 布局的框架 。框架可以 物理 上将一个页面 分成若干区域,每个区域可以载入一个网页。
,ASP程序设计,43
2.8 框架结构
2.8.1 框架结构的文件格式
2.8.2 框架结构标记的使用
2.8.3 FRAME标记
2.8.4 与框架相关的 TARGET属性
,ASP程序设计,44
2.8.1 框架结构的文件格式具体格式如下：
<HTML>
<HEAD>…</HEAD>
<FRAMESET>
<FRAME>
…
<FRAME>
…
</FRAMESET>
</HTML>
注意：
在文档中,若使用了
<FRAMESET>,就不应该有 <BODY>标记 。
老版本的浏览器可能不支持框架结构 。
,ASP程序设计,45
2.8.2 框架结构标记的使用
<FRAMESET>…</FRAMESET>
rows=size,设置多重框架的高度 。
cols=size,设置多重框架的宽度 。
frameborder=isdisplayborder
设置是否显示框架边框 。
border=num,设置框架的边框大小 。
,ASP程序设计,46
2.8.3 FRAME标记
src=URL,设置要载入的文件的路径和名称 。
name=framename,设置子窗口的名称
marginwidth=size：
设置显示内容和窗口左右边界的距离 。
marginheight=size：
设置显示内容和窗口上下边界的距离 。
scrolling=scrollingstyle：
设置子窗口是否使用滚动条
Noresize,设置是否能调整窗口大小 。
,ASP程序设计,47
2.8.4 与框架相关的 TARGET
当用户单击该链接时，链接的网页 默认会在原来的子窗口打开 。
如果要 指定在某个子窗口打开,就要使用
TARGET属性,将其取值设置为指定子窗口的名称，可以实现 链接 的 HTML文件 在指定子窗口 中打开。
,ASP程序设计,48
2.9.1 CSS样式简介
CSS（ Cascading Style Sheets,层叠样式表 ），是用来管理网页样式并将样式信息与网页内容分离的一种 标记性语言 。
它提供了 很多的样式定义 方式来辅助
HTML,可以对页面元素的字体、大小、颜色、背景、排列方式、区域尺寸等做到精确地控制。
,ASP程序设计,49
2.9 CSS基础
2.9.1 CSS样式简介
2.9.2 CSS样式表的定义
2.9.3 在 HTML中加入 CSS的方法
,ASP程序设计,50
2.9.2 CSS样式表的定义
1．通过 HTML标记定义属性和属性值之间用,,,隔开，多个属性时，使用,；,进行分隔。
2．用 id属性定义样式表以,#” 开头，属性和属性值写入大括号内。
3．使用 class定义样式表以,,” 开头，属性和属性值写入大括号内。
,ASP程序设计,51
2.9.3 在 HTML中加入 CSS
1．嵌入式样式表
2．内联式样式表
3．外联式样式表
4．输入式样式表
