网页制作基础语言HTML.ppt

《网页制作基础语言HTML.ppt》由会员分享，可在线阅读，更多相关《网页制作基础语言HTML.ppt（45页珍藏版）》请在金锄头文库上搜索。

1、第二部分 信息组织 网络信息组织基础语言HTML2.1 HTML2.1 HTML简介简介简介简介2.2 HTML2.2 HTML文档的基本结构文档的基本结构文档的基本结构文档的基本结构2.3 2.3 网页文件的创建过程网页文件的创建过程网页文件的创建过程网页文件的创建过程2.4 2.4 段落标记段落标记段落标记段落标记2.5 2.5 文字标记文字标记文字标记文字标记2.6 2.6 超链接超链接超链接超链接2.7 2.7 图片图片图片图片2.8 2.8 列表列表列表列表2.9 2.9 表格表格表格表格2.10 2.10 字幕、音频和视频字幕、音频和视频字幕、音频和视频字幕、音频和视频2.11 2

2、.11 框架（多窗口页面框架（多窗口页面框架（多窗口页面框架（多窗口页面）2.12 2.12 表单表单表单表单第第2部分部分 网页制作基础语言网页制作基础语言HTML HTMLHTML是是是是Hypertext Markup LanguageHypertext Markup Language（超文本标超文本标超文本标超文本标记语言）的缩写，是一种为普通文件中某些字句加上标识的记语言）的缩写，是一种为普通文件中某些字句加上标识的记语言）的缩写，是一种为普通文件中某些字句加上标识的记语言）的缩写，是一种为普通文件中某些字句加上标识的语言，其目的在于运用标记（语言，其目的在于运用标记（语言，其目的在

3、于运用标记（语言，其目的在于运用标记（tagtag）对文件达到预期的效果。对文件达到预期的效果。对文件达到预期的效果。对文件达到预期的效果。它是构成它是构成它是构成它是构成WebWeb页面（页面（页面（页面（PagePage），），），），用来表示用来表示用来表示用来表示WebWeb页面的符号标页面的符号标页面的符号标页面的符号标记语言。通过记语言。通过记语言。通过记语言。通过HTMLHTML，将所需要表达的信息按某种规则写成将所需要表达的信息按某种规则写成将所需要表达的信息按某种规则写成将所需要表达的信息按某种规则写成HTMLHTML文件，通过专用的浏览器来识别，并将这些文件，通过专用的浏览

4、器来识别，并将这些文件，通过专用的浏览器来识别，并将这些文件，通过专用的浏览器来识别，并将这些HTMLHTML文文文文件翻译成可以识别的信息，就是所见到的网页。件翻译成可以识别的信息，就是所见到的网页。件翻译成可以识别的信息，就是所见到的网页。件翻译成可以识别的信息，就是所见到的网页。 HTMLHTML语言是建立网页的规范或标准，从它出现发展到语言是建立网页的规范或标准，从它出现发展到语言是建立网页的规范或标准，从它出现发展到语言是建立网页的规范或标准，从它出现发展到现在，规范不断完善，功能越来越强。但是依然有缺陷和不现在，规范不断完善，功能越来越强。但是依然有缺陷和不现在，规范不断完善，功能

5、越来越强。但是依然有缺陷和不现在，规范不断完善，功能越来越强。但是依然有缺陷和不足，人们仍在不断的改进它，使它更加便于控制和有弹性，足，人们仍在不断的改进它，使它更加便于控制和有弹性，足，人们仍在不断的改进它，使它更加便于控制和有弹性，足，人们仍在不断的改进它，使它更加便于控制和有弹性，以适应网络上的应用需求。以适应网络上的应用需求。以适应网络上的应用需求。以适应网络上的应用需求。20002000年，年，年，年，W3CW3C组织公布发行了组织公布发行了组织公布发行了组织公布发行了XHTML 1.0XHTML 1.0版本。版本。版本。版本。XHTML 1.0XHTML 1.0是一种在是一种在是一

6、种在是一种在HTML 4.0HTML 4.0基础上优基础上优基础上优基础上优化和改进的新语言，目的是基于化和改进的新语言，目的是基于化和改进的新语言，目的是基于化和改进的新语言，目的是基于XMLXML应用。应用。应用。应用。XHTMLXHTML是一种是一种是一种是一种增强了的增强了的增强了的增强了的HTMLHTML，它的可扩展性和灵活性将适应未来网络应它的可扩展性和灵活性将适应未来网络应它的可扩展性和灵活性将适应未来网络应它的可扩展性和灵活性将适应未来网络应用更多的需求。用更多的需求。用更多的需求。用更多的需求。 2.1 HTML2.1 HTML简介简介简介简介 1.1.标记标记标记标记 HT

7、MLHTML文档由标记和被标记的内容组成。标记（文档由标记和被标记的内容组成。标记（文档由标记和被标记的内容组成。标记（文档由标记和被标记的内容组成。标记（tagtag）能能能能产生所需的各种效果。格式为：产生所需的各种效果。格式为：产生所需的各种效果。格式为：产生所需的各种效果。格式为： 受标记影响的内容受标记影响的内容受标记影响的内容受标记影响的内容 / 例如，标题标记例如，标题标记例如，标题标记例如，标题标记表示为：表示为：表示为：表示为： 我的第一个网页我的第一个网页我的第一个网页我的第一个网页 2. 2. 标记的属性标记的属性标记的属性标记的属性 标记只是规定这是什么信息，或是文本，

8、或是图片，但标记只是规定这是什么信息，或是文本，或是图片，但标记只是规定这是什么信息，或是文本，或是图片，但标记只是规定这是什么信息，或是文本，或是图片，但怎样显示或控制这些信息，就需要在标记后面加上相关的属怎样显示或控制这些信息，就需要在标记后面加上相关的属怎样显示或控制这些信息，就需要在标记后面加上相关的属怎样显示或控制这些信息，就需要在标记后面加上相关的属性来表示，每个标记有一系列的属性。格式为：性来表示，每个标记有一系列的属性。格式为：性来表示，每个标记有一系列的属性。格式为：性来表示，每个标记有一系列的属性。格式为： 2 受受受受影响的内容影响的内容影响的内容影响的内容 / 例如，字

9、体标记例如，字体标记例如，字体标记例如，字体标记有属性有属性有属性有属性sizesize和和和和colorcolor等。等。等。等。 属性示例属性示例属性示例属性示例 2.2 HTML2.2 HTML文档的基本结构文档的基本结构文档的基本结构文档的基本结构 2.2.1 2.2.1 标记及其属性标记及其属性标记及其属性标记及其属性 HTMLHTML文档是一种纯文本格式的文件，文档是一种纯文本格式的文件，文档是一种纯文本格式的文件，文档是一种纯文本格式的文件，HTMLHTML文档文档文档文档的基本结构为：的基本结构为：的基本结构为：的基本结构为： 网页的标题网页的标题网页的标题网页的标题 网页的内

10、容网页的内容网页的内容网页的内容 【例例例例2-12-1】2.2 HTML2.2 HTML文档的基本结构文档的基本结构文档的基本结构文档的基本结构 2.2.2 HTML2.2.2 HTML的基本结构的基本结构的基本结构的基本结构 用最简单的用最简单的用最简单的用最简单的“ “记事本记事本记事本记事本” ”来编辑网页。来编辑网页。来编辑网页。来编辑网页。 打开记事本。单击打开记事本。单击打开记事本。单击打开记事本。单击WindowsWindows的的的的“ “开始开始开始开始” ”按钮，在按钮，在按钮，在按钮，在“ “程序程序程序程序” ”菜单中的菜单中的菜单中的菜单中的“ “附件附件附件附件”

11、 ”子菜单中单击子菜单中单击子菜单中单击子菜单中单击“ “记事本记事本记事本记事本” ”。 创建新文件，并按创建新文件，并按创建新文件，并按创建新文件，并按HTMLHTML语言规则编辑。在语言规则编辑。在语言规则编辑。在语言规则编辑。在“ “记事本记事本记事本记事本” ”窗口中输入窗口中输入窗口中输入窗口中输入HTMLHTML语言，输入的内容。语言，输入的内容。语言，输入的内容。语言，输入的内容。 保存网页。打开保存网页。打开保存网页。打开保存网页。打开“ “记事本记事本记事本记事本” ”的的的的“ “文件文件文件文件” ”菜单，选择菜单，选择菜单，选择菜单，选择“ “保存保存保存保存” ”。

12、此时将出现。此时将出现。此时将出现。此时将出现“ “另存为另存为另存为另存为” ”对话框，在对话框，在对话框，在对话框，在“ “保存在保存在保存在保存在” ”下下下下拉列表框中选择文件要存放的路径；在拉列表框中选择文件要存放的路径；在拉列表框中选择文件要存放的路径；在拉列表框中选择文件要存放的路径；在“ “文件名文件名文件名文件名” ”文本框输文本框输文本框输文本框输入以入以入以入以.html.html或或或或. .htmhtm为后缀的文件名，如为后缀的文件名，如为后缀的文件名，如为后缀的文件名，如mypage1.htmlmypage1.html；在在在在“ “保存类型保存类型保存类型保存类型

13、” ”下拉列表框中选择下拉列表框中选择下拉列表框中选择下拉列表框中选择“ “文本文档文本文档文本文档文本文档” ”。最后单击。最后单击。最后单击。最后单击“ “保存保存保存保存” ”按钮，将记事本中的内容保存在磁盘中。按钮，将记事本中的内容保存在磁盘中。按钮，将记事本中的内容保存在磁盘中。按钮，将记事本中的内容保存在磁盘中。 如果希望这一页是网站的首页（主页），想让浏览者输如果希望这一页是网站的首页（主页），想让浏览者输如果希望这一页是网站的首页（主页），想让浏览者输如果希望这一页是网站的首页（主页），想让浏览者输入网址后，就显示这一页的内容，可以把这个文件设为默认入网址后，就显示这一页的内容

14、，可以把这个文件设为默认入网址后，就显示这一页的内容，可以把这个文件设为默认入网址后，就显示这一页的内容，可以把这个文件设为默认文档，文件名为文档，文件名为文档，文件名为文档，文件名为index.htmlindex.html或或或或index.htmindex.htm。 2.3 2.3 网页文件的创建过程网页文件的创建过程网页文件的创建过程网页文件的创建过程 2.3.1 2.3.1 编辑和保存网页编辑和保存网页编辑和保存网页编辑和保存网页 通过编辑可以得到一个通过编辑可以得到一个通过编辑可以得到一个通过编辑可以得到一个.html.html文件，要想使这个文档显文件，要想使这个文档显文件，要想使

15、这个文档显文件，要想使这个文档显示出网页的样子，就要使用浏览器进行预览。有两种方法示出网页的样子，就要使用浏览器进行预览。有两种方法示出网页的样子，就要使用浏览器进行预览。有两种方法示出网页的样子，就要使用浏览器进行预览。有两种方法可以打开可以打开可以打开可以打开.html.html网页文件。网页文件。网页文件。网页文件。 1. 1. 用浏览器打开用浏览器打开用浏览器打开用浏览器打开 网页在浏览后会有不满意的地方，此时可重新在网页在浏览后会有不满意的地方，此时可重新在网页在浏览后会有不满意的地方，此时可重新在网页在浏览后会有不满意的地方，此时可重新在“ “记记记记事本事本事本事本” ”中打开该

16、中打开该中打开该中打开该.html.html文件修改；或者在浏览器中直接打开文件修改；或者在浏览器中直接打开文件修改；或者在浏览器中直接打开文件修改；或者在浏览器中直接打开源文件（在源文件（在源文件（在源文件（在IEIE中，从中，从中，从中，从“ “查看查看查看查看” ”菜单中的菜单中的菜单中的菜单中的“ “源文件源文件源文件源文件” ”中打开）中打开）中打开）中打开）。修改后，单击。修改后，单击。修改后，单击。修改后，单击“ “文件文件文件文件” ”菜单中的菜单中的菜单中的菜单中的“ “保存保存保存保存” ”命令。如果浏命令。如果浏命令。如果浏命令。如果浏览器没有关闭，要在浏览器中看到修改后

17、的效果，不必重览器没有关闭，要在浏览器中看到修改后的效果，不必重览器没有关闭，要在浏览器中看到修改后的效果，不必重览器没有关闭，要在浏览器中看到修改后的效果，不必重新打开该文件，直接单击浏览器工具栏上的新打开该文件，直接单击浏览器工具栏上的新打开该文件，直接单击浏览器工具栏上的新打开该文件，直接单击浏览器工具栏上的“ “刷新刷新刷新刷新” ”按钮。按钮。按钮。按钮。 2. 2. 在在在在“ “WindowsWindows资源管理器资源管理器资源管理器资源管理器” ”或或或或“ “我的电脑我的电脑我的电脑我的电脑” ”中打开中打开中打开中打开 在在在在“ “WindowsWindows资源管理器

18、资源管理器资源管理器资源管理器” ”或或或或“ “我的电脑我的电脑我的电脑我的电脑” ”中双击要打中双击要打中双击要打中双击要打开的开的开的开的.html.html文件，这时将直接在默认的浏览器中打开该文件，这时将直接在默认的浏览器中打开该文件，这时将直接在默认的浏览器中打开该文件，这时将直接在默认的浏览器中打开该.html.html文件。文件。文件。文件。 2.3 2.3 网页文件的创建过程网页文件的创建过程网页文件的创建过程网页文件的创建过程 2.3.2 2.3.2 预览网页预览网页预览网页预览网页 注释标记的格式为：注释标记的格式为：注释标记的格式为：注释标记的格式为： !- - 注释并

19、不局限于一行，长度不受限制。结束标记与开始标注释并不局限于一行，长度不受限制。结束标记与开始标注释并不局限于一行，长度不受限制。结束标记与开始标注释并不局限于一行，长度不受限制。结束标记与开始标记可以不在一行上。记可以不在一行上。记可以不在一行上。记可以不在一行上。 2.4.2 2.4.2 强制换行和不换行标记强制换行和不换行标记强制换行和不换行标记强制换行和不换行标记 、 . 要用要用要用要用HTMLHTML的标记来强制换行、分段。的标记来强制换行、分段。的标记来强制换行、分段。的标记来强制换行、分段。放在一行的放在一行的放在一行的放在一行的末尾，可以使后面的文字、图片、表格等显示于下一行，

20、而又末尾，可以使后面的文字、图片、表格等显示于下一行，而又末尾，可以使后面的文字、图片、表格等显示于下一行，而又末尾，可以使后面的文字、图片、表格等显示于下一行，而又不会在行与行之间留下空行，即强制文本换行。强制换行标记不会在行与行之间留下空行，即强制文本换行。强制换行标记不会在行与行之间留下空行，即强制文本换行。强制换行标记不会在行与行之间留下空行，即强制文本换行。强制换行标记的格式为：的格式为：的格式为：的格式为： 文字文字 不换行标记可令文字不能因太长使浏览器无法显示而换行，不换行标记可令文字不能因太长使浏览器无法显示而换行，不换行标记可令文字不能因太长使浏览器无法显示而换行，不换行标记

21、可令文字不能因太长使浏览器无法显示而换行，它对住址、数学公式、一行数字等尤其有用。其格式为：它对住址、数学公式、一行数字等尤其有用。其格式为：它对住址、数学公式、一行数字等尤其有用。其格式为：它对住址、数学公式、一行数字等尤其有用。其格式为： 文字文字 【例例2-2】 2.4 2.4 段落标记段落标记段落标记段落标记2.4.1 2.4.1 注释标记注释标记注释标记注释标记 段落标记放在一个段落的头尾，用于定义一个段落。段落标记放在一个段落的头尾，用于定义一个段落。段落标记放在一个段落的头尾，用于定义一个段落。段落标记放在一个段落的头尾，用于定义一个段落。.标记不但能使后面的文字换到下一行，还可

22、标记不但能使后面的文字换到下一行，还可标记不但能使后面的文字换到下一行，还可标记不但能使后面的文字换到下一行，还可以使两段之间多一空行，相当于两个以使两段之间多一空行，相当于两个以使两段之间多一空行，相当于两个以使两段之间多一空行，相当于两个标记。段标记。段标记。段标记。段落标记的格式为：落标记的格式为：落标记的格式为：落标记的格式为： 文字文字文字文字 一个段落标记一个段落标记一个段落标记一个段落标记可以看作是两个可以看作是两个可以看作是两个可以看作是两个标记，即标记，即标记，即标记，即。 其中属性其中属性其中属性其中属性alignalign用来设置段落文字在网页上的对齐方式：用来设置段落文

23、字在网页上的对齐方式：用来设置段落文字在网页上的对齐方式：用来设置段落文字在网页上的对齐方式：leftleft（左对齐）、左对齐）、左对齐）、左对齐）、centercenter（居中）和居中）和居中）和居中）和rightright（右对齐）。缺右对齐）。缺右对齐）。缺右对齐）。缺省时默认为省时默认为省时默认为省时默认为leftleft。 格式中的格式中的格式中的格式中的“ “|”|”表示表示表示表示“ “或者或者或者或者” ”，即多中选一。，即多中选一。，即多中选一。，即多中选一。【例例例例2-32-3】 2.4 2.4 段落标记段落标记段落标记段落标记2.4.3 2.4.3 段落标记段落标记

24、段落标记段落标记. . 设定文字、图像、表格的摆放位置。当在许多段落中设定文字、图像、表格的摆放位置。当在许多段落中设定文字、图像、表格的摆放位置。当在许多段落中设定文字、图像、表格的摆放位置。当在许多段落中设置对齐方式时，常使用设置对齐方式时，常使用设置对齐方式时，常使用设置对齐方式时，常使用标记。定位标记标记。定位标记标记。定位标记标记。定位标记的格式为：的格式为：的格式为：的格式为： 文本、图像或表文本、图像或表文本、图像或表文本、图像或表格格格格 其中属性其中属性其中属性其中属性alignalign用来设置文本块、一段文字或标题在网用来设置文本块、一段文字或标题在网用来设置文本块、一段

25、文字或标题在网用来设置文本块、一段文字或标题在网页上的对齐方式：页上的对齐方式：页上的对齐方式：页上的对齐方式：leftleft、centercenter和和和和rightright。缺省时默认为缺省时默认为缺省时默认为缺省时默认为leftleft。【例例例例2-42-4】 2.4 2.4 段落标记段落标记段落标记段落标记2.4.4 2.4.4 定位标记定位标记定位标记定位标记 在页面中插入一条水平标尺线，可以使不同功能的文字在页面中插入一条水平标尺线，可以使不同功能的文字在页面中插入一条水平标尺线，可以使不同功能的文字在页面中插入一条水平标尺线，可以使不同功能的文字分隔开，看起来整齐、明了。

26、当浏览器解释到分隔开，看起来整齐、明了。当浏览器解释到分隔开，看起来整齐、明了。当浏览器解释到分隔开，看起来整齐、明了。当浏览器解释到HTMLHTML文档中文档中文档中文档中的的的的标记时，会在此处换行，并加入一条水平线段。线标记时，会在此处换行，并加入一条水平线段。线标记时，会在此处换行，并加入一条水平线段。线标记时，会在此处换行，并加入一条水平线段。线段的样式由标记的参数决定。段的样式由标记的参数决定。段的样式由标记的参数决定。段的样式由标记的参数决定。 水平线标记的格式为：水平线标记的格式为：水平线标记的格式为：水平线标记的格式为： hr align=left|center|right

27、size= sizesize设定线条粗细，以像素为单位，默认为设定线条粗细，以像素为单位，默认为设定线条粗细，以像素为单位，默认为设定线条粗细，以像素为单位，默认为2 2。 widthwidth设定线段长度，可以是绝对值（以像素为单位）设定线段长度，可以是绝对值（以像素为单位）设定线段长度，可以是绝对值（以像素为单位）设定线段长度，可以是绝对值（以像素为单位）或相对值（相对于当前窗口的百分比）。或相对值（相对于当前窗口的百分比）。或相对值（相对于当前窗口的百分比）。或相对值（相对于当前窗口的百分比）。 colorcolor设定线条色彩，默认为黑色。可以采用色彩的名设定线条色彩，默认为黑色。可以

28、采用色彩的名设定线条色彩，默认为黑色。可以采用色彩的名设定线条色彩，默认为黑色。可以采用色彩的名称。色彩可以用相应英文单词或以称。色彩可以用相应英文单词或以称。色彩可以用相应英文单词或以称。色彩可以用相应英文单词或以“ “#”#”引导的一个十六进引导的一个十六进引导的一个十六进引导的一个十六进制数代码来表示。制数代码来表示。制数代码来表示。制数代码来表示。【例例例例2-52-5】 2.4 2.4 段落标记段落标记段落标记段落标记2.4.5 2.4.5 水平线标记水平线标记水平线标记水平线标记 在页面中，标题是一段文字内容的核心，所以总是用加强在页面中，标题是一段文字内容的核心，所以总是用加强在

29、页面中，标题是一段文字内容的核心，所以总是用加强在页面中，标题是一段文字内容的核心，所以总是用加强的效果来表示。网页中的信息可以分为主要点、次要点，可以的效果来表示。网页中的信息可以分为主要点、次要点，可以的效果来表示。网页中的信息可以分为主要点、次要点，可以的效果来表示。网页中的信息可以分为主要点、次要点，可以通过设置不同大小的标题，为文章增加条理。标题文字标记的通过设置不同大小的标题，为文章增加条理。标题文字标记的通过设置不同大小的标题，为文章增加条理。标题文字标记的通过设置不同大小的标题，为文章增加条理。标题文字标记的格式为：格式为：格式为：格式为： 标题文字标题文字标题文字标题文字 #

30、 #用来指定标题文字的大小，用来指定标题文字的大小，用来指定标题文字的大小，用来指定标题文字的大小，#取取取取1 16 6的整数值，取的整数值，取的整数值，取的整数值，取1 1时时时时文字最大，文字最大，文字最大，文字最大，6 6时文字最小。时文字最小。时文字最小。时文字最小。 属性属性属性属性alignalign设置标题在页面中的对齐方式：设置标题在页面中的对齐方式：设置标题在页面中的对齐方式：设置标题在页面中的对齐方式：leftleft、centercenter或或或或rightright。缺省时默认为缺省时默认为缺省时默认为缺省时默认为leftleft。 标记缺省显示宋体，在一个标题行中

31、无标记缺省显示宋体，在一个标题行中无标记缺省显示宋体，在一个标题行中无标记缺省显示宋体，在一个标题行中无法使用不同大小的字体。法使用不同大小的字体。法使用不同大小的字体。法使用不同大小的字体。 与用与用与用与用定义的网页标题不同，标题格式定义的网页标题不同，标题格式定义的网页标题不同，标题格式定义的网页标题不同，标题格式显示在浏览器窗口内，而不显示在浏览器的标题栏中。显示在浏览器窗口内，而不显示在浏览器的标题栏中。显示在浏览器窗口内，而不显示在浏览器的标题栏中。显示在浏览器窗口内，而不显示在浏览器的标题栏中。【例例例例2-62-6】 2.5 2.5 文字标记文字标记文字标记文字标记 2.5.1

32、 2.5.1 标题文字标记标题文字标记标题文字标记标题文字标记 在网页中为了增强页面的层次，其中的文字可以用不同在网页中为了增强页面的层次，其中的文字可以用不同在网页中为了增强页面的层次，其中的文字可以用不同在网页中为了增强页面的层次，其中的文字可以用不同的大小、字体、字型、色彩。用的大小、字体、字型、色彩。用的大小、字体、字型、色彩。用的大小、字体、字型、色彩。用标记设置字号标记设置字号标记设置字号标记设置字号（被被被被W3CW3C列为不建议使用的标记，以后将学习用列为不建议使用的标记，以后将学习用列为不建议使用的标记，以后将学习用列为不建议使用的标记，以后将学习用CSSCSS来设定字体）。

33、设置文字大小的格式为：来设定字体）。设置文字大小的格式为：来设定字体）。设置文字大小的格式为：来设定字体）。设置文字大小的格式为： font size= 被被被被设置的文字设置的文字设置的文字设置的文字 标记可设定文字的字体、字号和色彩。标记可设定文字的字体、字号和色彩。标记可设定文字的字体、字号和色彩。标记可设定文字的字体、字号和色彩。 sizesize用来设置文字的大小。数字的取值范围从用来设置文字的大小。数字的取值范围从用来设置文字的大小。数字的取值范围从用来设置文字的大小。数字的取值范围从1 17 7，sizesize取取取取1 1时最小，取时最小，取时最小，取时最小，取7 7时最大。

34、时最大。时最大。时最大。 faceface用来设置字体。如黑体、宋体、楷体用来设置字体。如黑体、宋体、楷体用来设置字体。如黑体、宋体、楷体用来设置字体。如黑体、宋体、楷体_GB2312_GB2312、隶书、隶书、隶书、隶书、Times New RomanTimes New Roman等。等。等。等。 colorcolor用来设置文字色彩。用来设置文字色彩。用来设置文字色彩。用来设置文字色彩。【例例例例2-72-7】 【例例2-8】 【例例2-9】 【例例2-10】 2.5 2.5 文字标记文字标记文字标记文字标记 2.5.2 2.5.2 字体标记字体标记字体标记字体标记./font. 超链接（

35、超链接（超链接（超链接（HyperlinkHyperlink）是网页互相联系的桥梁，超链接是网页互相联系的桥梁，超链接是网页互相联系的桥梁，超链接是网页互相联系的桥梁，超链接可以看作是一个可以看作是一个可以看作是一个可以看作是一个“ “热点热点热点热点” ”，它可以从当前网页定义的位置跳，它可以从当前网页定义的位置跳，它可以从当前网页定义的位置跳，它可以从当前网页定义的位置跳转到其他位置，包括当前页的某个位置、转到其他位置，包括当前页的某个位置、转到其他位置，包括当前页的某个位置、转到其他位置，包括当前页的某个位置、InternetInternet或本地或本地或本地或本地硬盘或局域网上的其他文

36、件，甚至跳转到声音、图片等多媒硬盘或局域网上的其他文件，甚至跳转到声音、图片等多媒硬盘或局域网上的其他文件，甚至跳转到声音、图片等多媒硬盘或局域网上的其他文件，甚至跳转到声音、图片等多媒体文件。浏览网页是超链接最普遍的一种应用，通过超链接体文件。浏览网页是超链接最普遍的一种应用，通过超链接体文件。浏览网页是超链接最普遍的一种应用，通过超链接体文件。浏览网页是超链接最普遍的一种应用，通过超链接还可以获得不同形态的服务，如文件传输、资料查询、电子还可以获得不同形态的服务，如文件传输、资料查询、电子还可以获得不同形态的服务，如文件传输、资料查询、电子还可以获得不同形态的服务，如文件传输、资料查询、电

37、子邮件、远程访问等。邮件、远程访问等。邮件、远程访问等。邮件、远程访问等。 当网页包含超链接时，网页中的外观形式为彩色（一当网页包含超链接时，网页中的外观形式为彩色（一当网页包含超链接时，网页中的外观形式为彩色（一当网页包含超链接时，网页中的外观形式为彩色（一般为蓝色）且带下划线的文字或图片。单击这些文本或图片，般为蓝色）且带下划线的文字或图片。单击这些文本或图片，般为蓝色）且带下划线的文字或图片。单击这些文本或图片，般为蓝色）且带下划线的文字或图片。单击这些文本或图片，可跳转到相应位置。鼠标指针指向超链接的显示文本或图片可跳转到相应位置。鼠标指针指向超链接的显示文本或图片可跳转到相应位置。鼠

38、标指针指向超链接的显示文本或图片可跳转到相应位置。鼠标指针指向超链接的显示文本或图片时，将变成手形。超文本链接使用锚点标记时，将变成手形。超文本链接使用锚点标记时，将变成手形。超文本链接使用锚点标记时，将变成手形。超文本链接使用锚点标记来定义。来定义。来定义。来定义。 2.6 2.6 超链接超链接超链接超链接 锚点（锚点（锚点（锚点（anchoranchor）标记由标记由标记由标记由定义，它在网页上建立超定义，它在网页上建立超定义，它在网页上建立超定义，它在网页上建立超文本链接。通过单击一个词、句或图片，可从此处转到另一文本链接。通过单击一个词、句或图片，可从此处转到另一文本链接。通过单击一个

39、词、句或图片，可从此处转到另一文本链接。通过单击一个词、句或图片，可从此处转到另一个链接资源（目标资源），这个目标资源有惟一的地址个链接资源（目标资源），这个目标资源有惟一的地址个链接资源（目标资源），这个目标资源有惟一的地址个链接资源（目标资源），这个目标资源有惟一的地址（URLURL）。）。）。）。具有以上特点的词、句或图片就称为热点。具有以上特点的词、句或图片就称为热点。具有以上特点的词、句或图片就称为热点。具有以上特点的词、句或图片就称为热点。 标记的格式为：标记的格式为：标记的格式为：标记的格式为： a 热点热点热点热点 hrefhref属性为超文本引用，它的值为一个属性为超文本引用

40、，它的值为一个属性为超文本引用，它的值为一个属性为超文本引用，它的值为一个URLURL，是目标是目标是目标是目标资源的有效地址。如果要创建一个不链接到其他位置的空超资源的有效地址。如果要创建一个不链接到其他位置的空超资源的有效地址。如果要创建一个不链接到其他位置的空超资源的有效地址。如果要创建一个不链接到其他位置的空超链接，可用链接，可用链接，可用链接，可用“ “#”#”代替代替代替代替URLURL，即，即，即，即a =# 热点热点热点热点 。 targettarget属性设定链接被单击后结果所要开始窗口的方式。属性设定链接被单击后结果所要开始窗口的方式。属性设定链接被单击后结果所要开始窗口的

41、方式。属性设定链接被单击后结果所要开始窗口的方式。可选值为：可选值为：可选值为：可选值为：_blank_blank，_parent_parent，_self_self，_top_top。2.6 2.6 超链接超链接超链接超链接2.6.1 2.6.1 锚点标记锚点标记锚点标记锚点标记. . 1. 1. 链接到同一目录内的网页文件链接到同一目录内的网页文件链接到同一目录内的网页文件链接到同一目录内的网页文件 链接到同一目录内的网页文件的格式为：链接到同一目录内的网页文件的格式为：链接到同一目录内的网页文件的格式为：链接到同一目录内的网页文件的格式为： a .html 热点文本热点文本热点文本热点文

42、本 【例例例例2-112-11】 2. 2. 链接到下一级目录中的网页文件链接到下一级目录中的网页文件链接到下一级目录中的网页文件链接到下一级目录中的网页文件 链接到下一级目录中网页文件的格式为：链接到下一级目录中网页文件的格式为：链接到下一级目录中网页文件的格式为：链接到下一级目录中网页文件的格式为： a .html 热点文本热点文本热点文本热点文本 3. 3. 链接到上一级目录中的网页文件链接到上一级目录中的网页文件链接到上一级目录中的网页文件链接到上一级目录中的网页文件 链接到上一级目录中网页文件的格式为：链接到上一级目录中网页文件的格式为：链接到上一级目录中网页文件的格式为：链接到上一

43、级目录中网页文件的格式为： a .html 热点文本热点文本热点文本热点文本 其中其中其中其中“ “. . /. . /表示退到上一级目录中。表示退到上一级目录中。表示退到上一级目录中。表示退到上一级目录中。 4. 4. 链接到同级目录中的网页文件链接到同级目录中的网页文件链接到同级目录中的网页文件链接到同级目录中的网页文件 链接到同级目录中网页文件的格式为：链接到同级目录中网页文件的格式为：链接到同级目录中网页文件的格式为：链接到同级目录中网页文件的格式为：a .html 热点文本热点文本热点文本热点文本 2.6 2.6 超链接超链接超链接超链接2.6.2 2.6.2 指向其他页面的链接指向

44、其他页面的链接指向其他页面的链接指向其他页面的链接 要在当前页面内实现超链接，需要定义两个标记：一个为要在当前页面内实现超链接，需要定义两个标记：一个为要在当前页面内实现超链接，需要定义两个标记：一个为要在当前页面内实现超链接，需要定义两个标记：一个为超链接标记，另一个为书签标记。超链接标记的格式为：超链接标记，另一个为书签标记。超链接标记的格式为：超链接标记，另一个为书签标记。超链接标记的格式为：超链接标记，另一个为书签标记。超链接标记的格式为： a 热点文本热点文本热点文本热点文本 书签就是用书签就是用书签就是用书签就是用标记对该文本作一个记号。格式为：标记对该文本作一个记号。格式为：标记

45、对该文本作一个记号。格式为：标记对该文本作一个记号。格式为： a name= 目标文本附近的字符串目标文本附近的字符串目标文本附近的字符串目标文本附近的字符串 【例例例例2-122-12】 如果要建立指向其他页面某处的文本，格式为：如果要建立指向其他页面某处的文本，格式为：如果要建立指向其他页面某处的文本，格式为：如果要建立指向其他页面某处的文本，格式为： a 热点文本热点文本热点文本热点文本 要在跳转到的位置处加上链接标记：要在跳转到的位置处加上链接标记：要在跳转到的位置处加上链接标记：要在跳转到的位置处加上链接标记： a name= 文字串文字串文字串文字串 如果链接指向其他文件的某一部分

46、，格式为：如果链接指向其他文件的某一部分，格式为：如果链接指向其他文件的某一部分，格式为：如果链接指向其他文件的某一部分，格式为： a 热点文本热点文本热点文本热点文本 2.6 2.6 超链接超链接超链接超链接2.6.3 2.6.3 指向本页中的链接指向本页中的链接指向本页中的链接指向本页中的链接 如果链接到的文件不是如果链接到的文件不是如果链接到的文件不是如果链接到的文件不是HTMLHTML文件，则该文件将作为下载文件，则该文件将作为下载文件，则该文件将作为下载文件，则该文件将作为下载文件，其格式为：文件，其格式为：文件，其格式为：文件，其格式为： a 热点文本热点文本热点文本热点文本 【例

47、例例例2-132-13】 2.6.5 2.6.5 指向电子邮件的链接指向电子邮件的链接指向电子邮件的链接指向电子邮件的链接 单击指向电子邮件的链接，将打开缺省的电子邮件程序，单击指向电子邮件的链接，将打开缺省的电子邮件程序，单击指向电子邮件的链接，将打开缺省的电子邮件程序，单击指向电子邮件的链接，将打开缺省的电子邮件程序，如如如如FoxMailFoxMail、Outlook ExpressOutlook Express，并自动填写邮件地址。指向并自动填写邮件地址。指向并自动填写邮件地址。指向并自动填写邮件地址。指向电子邮件链接的格式为：电子邮件链接的格式为：电子邮件链接的格式为：电子邮件链接的

48、格式为： 热点文本热点文本 例如，例如，例如，例如，E-mailE-mail地址是地址是地址是地址是，建立如下建立如下建立如下建立如下链接：链接：链接：链接： 免费电话免费电话免费电话免费电话:80012345678 :80012345678 信箱信箱信箱信箱:a :2.6 2.6 超链接超链接超链接超链接2.6.4 2.6.4 指向下载文件的链接指向下载文件的链接指向下载文件的链接指向下载文件的链接 1. 1. 设置背景色设置背景色设置背景色设置背景色 格式为：格式为：格式为：格式为： body “ “色彩值色彩值色彩值色彩值” ”可以为色彩的英文名或相应十六进制值。可以为色彩的英文名或相应

49、十六进制值。可以为色彩的英文名或相应十六进制值。可以为色彩的英文名或相应十六进制值。 2. 2. 用图片作为背景用图片作为背景用图片作为背景用图片作为背景 使用使用使用使用标记的标记的标记的标记的backgroundbackground属性，可为网页铺上背属性，可为网页铺上背属性，可为网页铺上背属性，可为网页铺上背景图片。格式为：景图片。格式为：景图片。格式为：景图片。格式为： body background= background background取值为一个图片文件名，并且要指出文件取值为一个图片文件名，并且要指出文件取值为一个图片文件名，并且要指出文件取值为一个图片文件名，并且要指出文

50、件存放的路径，可以是相对路径，也可以是绝对路径。图片文件存放的路径，可以是相对路径，也可以是绝对路径。图片文件存放的路径，可以是相对路径，也可以是绝对路径。图片文件存放的路径，可以是相对路径，也可以是绝对路径。图片文件可为可为可为可为GIFGIF格式或格式或格式或格式或JPEGJPEG格式的文件。格式的文件。格式的文件。格式的文件。 在浏览器中，作为背景的图片将按原来的大小复制，重复在浏览器中，作为背景的图片将按原来的大小复制，重复在浏览器中，作为背景的图片将按原来的大小复制，重复在浏览器中，作为背景的图片将按原来的大小复制，重复铺满整个网页。铺满整个网页。铺满整个网页。铺满整个网页。【例例例

51、例2-142-14】 2.7 2.7 图片图片图片图片2.7.1 2.7.1 网页的背景网页的背景网页的背景网页的背景 使用图片标记，可以把一幅图片加入到网页中。用图片标使用图片标记，可以把一幅图片加入到网页中。用图片标使用图片标记，可以把一幅图片加入到网页中。用图片标使用图片标记，可以把一幅图片加入到网页中。用图片标记还可以设置图片的替代文本、尺寸、布局等属性。图片标记记还可以设置图片的替代文本、尺寸、布局等属性。图片标记记还可以设置图片的替代文本、尺寸、布局等属性。图片标记记还可以设置图片的替代文本、尺寸、布局等属性。图片标记的格式为：的格式为：的格式为：的格式为： 如果不设定图片的尺寸，

52、图片将按照其本身的大小显示。如果不设定图片的尺寸，图片将按照其本身的大小显示。如果不设定图片的尺寸，图片将按照其本身的大小显示。如果不设定图片的尺寸，图片将按照其本身的大小显示。可使用可使用可使用可使用标记的标记的标记的标记的widthwidth和和和和heightheight属性来设置图片的大小。属性来设置图片的大小。属性来设置图片的大小。属性来设置图片的大小。widthwidth和和和和heightheight属性的属性值可取像素数，也可取百分数。属性的属性值可取像素数，也可取百分数。属性的属性值可取像素数，也可取百分数。属性的属性值可取像素数，也可取百分数。【例例例例2-152-15】

53、【例例2-16】 2.7 2.7 图片图片图片图片2.7.2 2.7.2 图片标记图片标记图片标记图片标记 如果不设置文本对图片的环绕，图片在页面会占一片空白。如果不设置文本对图片的环绕，图片在页面会占一片空白。如果不设置文本对图片的环绕，图片在页面会占一片空白。如果不设置文本对图片的环绕，图片在页面会占一片空白。利用利用利用利用标记的属性，可以使文本环绕图片。标记的属性，可以使文本环绕图片。标记的属性，可以使文本环绕图片。标记的属性，可以使文本环绕图片。 使用该标记设置文本环绕方式后，将一直有效，直到遇使用该标记设置文本环绕方式后，将一直有效，直到遇使用该标记设置文本环绕方式后，将一直有效，

54、直到遇使用该标记设置文本环绕方式后，将一直有效，直到遇到下一个设置标记。如果想取消文本环绕图片，可使用到下一个设置标记。如果想取消文本环绕图片，可使用到下一个设置标记。如果想取消文本环绕图片，可使用到下一个设置标记。如果想取消文本环绕图片，可使用clear标记，其后的文本将不再环绕图片。格式为：标记，其后的文本将不再环绕图片。格式为：标记，其后的文本将不再环绕图片。格式为：标记，其后的文本将不再环绕图片。格式为： clear=left|right|all 其中其中其中其中clearclear的取值可为：的取值可为：的取值可为：的取值可为：leftleft（解除在图片左侧放置的文解除在图片左侧放

55、置的文解除在图片左侧放置的文解除在图片左侧放置的文本）、本）、本）、本）、rightright（解除在图片右侧放置的文本）或解除在图片右侧放置的文本）或解除在图片右侧放置的文本）或解除在图片右侧放置的文本）或allall（解除在图解除在图解除在图解除在图片左、右侧放置的文本）。片左、右侧放置的文本）。片左、右侧放置的文本）。片左、右侧放置的文本）。 【例例2-17-1】 2.7 2.7 图片图片图片图片2.7.2 2.7.2 图片标记图片标记图片标记图片标记 图片也可作为热点，单击图片则跳转到被链接的文本或其图片也可作为热点，单击图片则跳转到被链接的文本或其图片也可作为热点，单击图片则跳转到被

56、链接的文本或其图片也可作为热点，单击图片则跳转到被链接的文本或其他文件。格式为：他文件。格式为：他文件。格式为：他文件。格式为：a 例如，下面代码：例如，下面代码：例如，下面代码：例如，下面代码： a =5 【例例2-17-2】2.7 2.7 图片图片图片图片2.7.3 2.7.3 用图片作为超链接用图片作为超链接用图片作为超链接用图片作为超链接 无序列表中每一个表项的前面是项目符号（如无序列表中每一个表项的前面是项目符号（如无序列表中每一个表项的前面是项目符号（如无序列表中每一个表项的前面是项目符号（如 、等符等符等符等符号）。建立无序列表使用号）。建立无序列表使用号）。建立无序列表使用号）

57、。建立无序列表使用标记和标记和标记和标记和表项标记。格式表项标记。格式表项标记。格式表项标记。格式为：为：为：为： 1 第一个列表项第一个列表项第一个列表项第一个列表项 2 第二个列表项第二个列表项第二个列表项第二个列表项 / 值得注意的是，值得注意的是，值得注意的是，值得注意的是，标记是单标记。即一个表项的开始，标记是单标记。即一个表项的开始，标记是单标记。即一个表项的开始，标记是单标记。即一个表项的开始，就是前一个表项的结束。就是前一个表项的结束。就是前一个表项的结束。就是前一个表项的结束。 typetype指定每个表项左端的符号类型，可为指定每个表项左端的符号类型，可为指定每个表项左端的

58、符号类型，可为指定每个表项左端的符号类型，可为discdisc（实心圆实心圆实心圆实心圆点）、点）、点）、点）、circlecircle（空心圆点）、空心圆点）、空心圆点）、空心圆点）、squaresquare（方块），也可自己设置方块），也可自己设置方块），也可自己设置方块），也可自己设置图片。图片。图片。图片。【例例例例2-182-18】 2.8 2.8 列表列表列表列表 2.8.1 2.8.1 无序列表标记无序列表标记无序列表标记无序列表标记 . 使用使用使用使用标记可以建立有序列表，表项的标记仍为标记可以建立有序列表，表项的标记仍为标记可以建立有序列表，表项的标记仍为标记可以建立有序列

59、表，表项的标记仍为。格式为：格式为：格式为：格式为： 1 表项表项表项表项1 1 2 表项表项表项表项2 2 / 有序列表整个表项与上下段文本之间各有一行空白；列表有序列表整个表项与上下段文本之间各有一行空白；列表有序列表整个表项与上下段文本之间各有一行空白；列表有序列表整个表项与上下段文本之间各有一行空白；列表项目向右缩进并左对齐；各表项前带顺序号。项目向右缩进并左对齐；各表项前带顺序号。项目向右缩进并左对齐；各表项前带顺序号。项目向右缩进并左对齐；各表项前带顺序号。【例例例例2-192-19】 列表嵌套把主页分为多个层次，例如书的目录，给人以列表嵌套把主页分为多个层次，例如书的目录，给人以

60、列表嵌套把主页分为多个层次，例如书的目录，给人以列表嵌套把主页分为多个层次，例如书的目录，给人以很强的层次感。有序列表和无序列表不仅可以自身嵌套，而且很强的层次感。有序列表和无序列表不仅可以自身嵌套，而且很强的层次感。有序列表和无序列表不仅可以自身嵌套，而且很强的层次感。有序列表和无序列表不仅可以自身嵌套，而且彼此可互相嵌套。彼此可互相嵌套。彼此可互相嵌套。彼此可互相嵌套。【例例例例2-202-20】 2.8 2.8 列表列表列表列表 2.8.2 2.8.2 有序列表标记有序列表标记有序列表标记有序列表标记 . 最简单的表格仅包括行和列。表格的标记为最简单的表格仅包括行和列。表格的标记为最简单

61、的表格仅包括行和列。表格的标记为最简单的表格仅包括行和列。表格的标记为，行行行行的标记为的标记为的标记为的标记为，表项的标记为表项的标记为表项的标记为表项的标记为。格式为：格式为：格式为：格式为： table border=n width=x|x% height=y|y% =j 表头表头表头表头1/1 表头表头表头表头2/2 表头表头表头表头n/n 表项表项表项表项1 1 表项表项表项表项2 2 表项表项表项表项nn 表项表项表项表项1 1 表项表项表项表项2 2 表项表项表项表项nn【例例例例2-212-21】 【例例2-22】 2.9 2.9 表格表格表格表格 2.9.1 2.9.1 简单

62、表格简单表格简单表格简单表格 在缺省下，表项居于单元格的左端。可用列、行的属性设在缺省下，表项居于单元格的左端。可用列、行的属性设在缺省下，表项居于单元格的左端。可用列、行的属性设在缺省下，表项居于单元格的左端。可用列、行的属性设置表项数据在单元格中的位置。置表项数据在单元格中的位置。置表项数据在单元格中的位置。置表项数据在单元格中的位置。 1. 1. 水平对齐水平对齐水平对齐水平对齐 表项数据的水平对齐用标记表项数据的水平对齐用标记表项数据的水平对齐用标记表项数据的水平对齐用标记、和和和和的的的的alignalign属性。属性。属性。属性。alignalign的属性值分别为：的属性值分别为：

63、的属性值分别为：的属性值分别为：centercenter（表项数据的居中表项数据的居中表项数据的居中表项数据的居中）、）、）、）、leftleft（左对齐）、左对齐）、左对齐）、左对齐）、rightright（右对齐）或右对齐）或右对齐）或右对齐）或justifyjustify（左右调整）。左右调整）。左右调整）。左右调整）。【例例例例2-232-23】 2. 2. 垂直对齐垂直对齐垂直对齐垂直对齐 表项数据的垂直对齐用标记表项数据的垂直对齐用标记表项数据的垂直对齐用标记表项数据的垂直对齐用标记、和和和和的的的的valignvalign属性。属性。属性。属性。valignvalign的属性值分

64、别为：的属性值分别为：的属性值分别为：的属性值分别为：toptop（靠单元格顶）、靠单元格顶）、靠单元格顶）、靠单元格顶）、bottombottom（靠单元格底）、靠单元格底）、靠单元格底）、靠单元格底）、middlemiddle（靠单元格中）或靠单元格中）或靠单元格中）或靠单元格中）或baselinebaseline（同行单元数据项位置一致）。同行单元数据项位置一致）。同行单元数据项位置一致）。同行单元数据项位置一致）。 【例例例例2-242-24】 2.9 2.9 表格表格表格表格 2.9.2 2.9.2 表格内文字的对齐方式表格内文字的对齐方式表格内文字的对齐方式表格内文字的对齐方式 前

65、面介绍的是表格中的各个单元格的属性。现在，把表格前面介绍的是表格中的各个单元格的属性。现在，把表格前面介绍的是表格中的各个单元格的属性。现在，把表格前面介绍的是表格中的各个单元格的属性。现在，把表格作为一个整体，介绍表格在页面中的位置及背景的设置。与图作为一个整体，介绍表格在页面中的位置及背景的设置。与图作为一个整体，介绍表格在页面中的位置及背景的设置。与图作为一个整体，介绍表格在页面中的位置及背景的设置。与图片一样，表格在浏览器窗口中的位置也有三种：居左、居中和片一样，表格在浏览器窗口中的位置也有三种：居左、居中和片一样，表格在浏览器窗口中的位置也有三种：居左、居中和片一样，表格在浏览器窗口

66、中的位置也有三种：居左、居中和居右。使用居右。使用居右。使用居右。使用标记的标记的标记的标记的alignalign属性。格式为：属性。格式为：属性。格式为：属性。格式为： 当表格位于页面的左侧或右侧时，文本填充在另一侧。当当表格位于页面的左侧或右侧时，文本填充在另一侧。当当表格位于页面的左侧或右侧时，文本填充在另一侧。当当表格位于页面的左侧或右侧时，文本填充在另一侧。当表格居中时，表格两边没有文本。当表格居中时，表格两边没有文本。当表格居中时，表格两边没有文本。当表格居中时，表格两边没有文本。当alignalign属性缺省时，文本属性缺省时，文本属性缺省时，文本属性缺省时，文本在表格的下面。在

67、表格的下面。在表格的下面。在表格的下面。2.9 2.9 表格表格表格表格 2.9.3 2.9.3 表格在页面中的对齐方式表格在页面中的对齐方式表格在页面中的对齐方式表格在页面中的对齐方式 在在在在、标记中，使用下面属标记中，使用下面属标记中，使用下面属标记中，使用下面属性可以改变表格的背景和边框的色彩、添加背景图片，也可以性可以改变表格的背景和边框的色彩、添加背景图片，也可以性可以改变表格的背景和边框的色彩、添加背景图片，也可以性可以改变表格的背景和边框的色彩、添加背景图片，也可以为行和单元格改变色彩、添加背景图片。为行和单元格改变色彩、添加背景图片。为行和单元格改变色彩、添加背景图片。为行和

68、单元格改变色彩、添加背景图片。 bgcolorbgcolor=色彩或色彩值色彩或色彩值色彩或色彩值色彩或色彩值 设置背景色彩设置背景色彩设置背景色彩设置背景色彩 background=background=图片文件名图片文件名图片文件名图片文件名 设置背景图片设置背景图片设置背景图片设置背景图片 bordercolorbordercolor=色彩色彩色彩色彩 设置表格边框的色彩设置表格边框的色彩设置表格边框的色彩设置表格边框的色彩 bordercolorlightbordercolorlight=色彩色彩色彩色彩 设置表格边框亮部的色彩设置表格边框亮部的色彩设置表格边框亮部的色彩设置表格边框亮

69、部的色彩 rules=row,colsrules=row,cols或或或或none none 设置表内线的显示方法，设置表内线的显示方法，设置表内线的显示方法，设置表内线的显示方法，nonenone为无内线为无内线为无内线为无内线 如果把属性放到如果把属性放到如果把属性放到如果把属性放到中，其作用范围为整个表格，中，其作用范围为整个表格，中，其作用范围为整个表格，中，其作用范围为整个表格，如果把属性放到如果把属性放到如果把属性放到如果把属性放到中，则作用范围为整个行，如果把属性中，则作用范围为整个行，如果把属性中，则作用范围为整个行，如果把属性中，则作用范围为整个行，如果把属性放到放到放到放到

70、、中，则作用范围为该单元格。中，则作用范围为该单元格。中，则作用范围为该单元格。中，则作用范围为该单元格。 【例例例例2-252-25】 2.9 2.9 表格表格表格表格 2.9.4 2.9.4 表格的色彩和图片背景表格的色彩和图片背景表格的色彩和图片背景表格的色彩和图片背景 流动字幕标记的格式为：流动字幕标记的格式为：流动字幕标记的格式为：流动字幕标记的格式为： marquee direction=left|right|up|down width=x|x% height=y 流动文字或（和）图片流动文字或（和）图片流动文字或（和）图片流动文字或（和）图片 【例例2-26-1】 流动文字流动文

71、字【例例2-26-2】 流动文字与流动图片流动文字与流动图片2.10 2.10 字幕、音频和视频字幕、音频和视频字幕、音频和视频字幕、音频和视频 2.10.1 2.10.1 字幕标记字幕标记字幕标记字幕标记 用浏览器可以播放的音频格式有：用浏览器可以播放的音频格式有：用浏览器可以播放的音频格式有：用浏览器可以播放的音频格式有：MIDIMIDI音乐、音乐、音乐、音乐、WAVWAV音乐、音乐、音乐、音乐、AUAU格式。格式。格式。格式。1. 1. 点播音乐点播音乐点播音乐点播音乐. 将音乐做成一个链接，只需单击该链接，就可以听到音乐将音乐做成一个链接，只需单击该链接，就可以听到音乐将音乐做成一个链

72、接，只需单击该链接，就可以听到音乐将音乐做成一个链接，只需单击该链接，就可以听到音乐了。其格式为：了。其格式为：了。其格式为：了。其格式为： a 热点文本热点文本热点文本热点文本 例如：播放一段例如：播放一段例如：播放一段例如：播放一段MIDIMIDI音乐：音乐：音乐：音乐： a 我们的爱我们的爱我们的爱我们的爱 2.10 2.10 字幕、音频和视频字幕、音频和视频字幕、音频和视频字幕、音频和视频 2.10.2 2.10.2 音频音频音频音频 2. 2. 内嵌音频播放插件内嵌音频播放插件内嵌音频播放插件内嵌音频播放插件 通过内嵌音频播放插件可以在浏览器中出现控制面板，也通过内嵌音频播放插件可以

73、在浏览器中出现控制面板，也通过内嵌音频播放插件可以在浏览器中出现控制面板，也通过内嵌音频播放插件可以在浏览器中出现控制面板，也可作为背景音乐。其格式为：可作为背景音乐。其格式为：可作为背景音乐。其格式为：可作为背景音乐。其格式为： embed 【例例2-27】 3. IE 3. IE中的背景音乐中的背景音乐中的背景音乐中的背景音乐 可以插入背景音乐格式，不过只有在可以插入背景音乐格式，不过只有在可以插入背景音乐格式，不过只有在可以插入背景音乐格式，不过只有在IEIE浏览器中才可以听浏览器中才可以听浏览器中才可以听浏览器中才可以听到。其格式为：到。其格式为：到。其格式为：到。其格式为： 播放次数

74、取播放次数取播放次数取播放次数取-1-1或或或或infinteinfinte时，声音将一直播放直到关闭该网时，声音将一直播放直到关闭该网时，声音将一直播放直到关闭该网时，声音将一直播放直到关闭该网页为止。页为止。页为止。页为止。 2.10 2.10 字幕、音频和视频字幕、音频和视频字幕、音频和视频字幕、音频和视频 2.10.2 2.10.2 音频音频音频音频 用浏览器可以播放的格式有：用浏览器可以播放的格式有：用浏览器可以播放的格式有：用浏览器可以播放的格式有：MOVMOV格式、格式、格式、格式、AVIAVI格式。格式。格式。格式。 1. 1. 链接一个视频文件链接一个视频文件链接一个视频文件

75、链接一个视频文件. 与链接音频文件一样，可将将将视频文件做成一个链接。与链接音频文件一样，可将将将视频文件做成一个链接。与链接音频文件一样，可将将将视频文件做成一个链接。与链接音频文件一样，可将将将视频文件做成一个链接。其格式为：其格式为：其格式为：其格式为： a 热点文本热点文本热点文本热点文本 例如：播放一段视频：例如：播放一段视频：例如：播放一段视频：例如：播放一段视频： a 欢迎光临欢迎光临欢迎光临欢迎光临 2. 2. 内嵌视频播放插件内嵌视频播放插件内嵌视频播放插件内嵌视频播放插件 格式为：格式为：格式为：格式为：embed 【例例例例2-282-28】 2.10 2.10 字幕、音

76、频和视频字幕、音频和视频字幕、音频和视频字幕、音频和视频 2.10.3 2.10.3 视频视频视频视频 框架（框架（框架（框架（FramesFrames）也称多窗口页面或帧，是在同一浏览器也称多窗口页面或帧，是在同一浏览器也称多窗口页面或帧，是在同一浏览器也称多窗口页面或帧，是在同一浏览器窗口中显示多个相互隔离的窗口中显示多个相互隔离的窗口中显示多个相互隔离的窗口中显示多个相互隔离的HTMLHTML页的结构，每个区域显示一页的结构，每个区域显示一页的结构，每个区域显示一页的结构，每个区域显示一个个个个HTMLHTML文件。文件。文件。文件。2.11.1 2.11.1 建立框架建立框架建立框架建

77、立框架 框架的建立使用框架的建立使用框架的建立使用框架的建立使用、两个标记。两个标记。两个标记。两个标记。用来划分窗格，用来划分窗格，用来划分窗格，用来划分窗格，标记用来声明其中框标记用来声明其中框标记用来声明其中框标记用来声明其中框架页面的内容。框架的基本结构为：架页面的内容。框架的基本结构为：架页面的内容。框架的基本结构为：架页面的内容。框架的基本结构为： . 2.11 2.11 框架（多窗口页面）框架（多窗口页面）框架（多窗口页面）框架（多窗口页面） 1. 1. 标记标记标记标记 标记用来定义一个框架组的属性，格式为：标记用来定义一个框架组的属性，格式为：标记用来定义一个框架组的属性，格

78、式为：标记用来定义一个框架组的属性，格式为： frameset row= 其中属性：其中属性：其中属性：其中属性： row row 设定横向分割的框架数目设定横向分割的框架数目设定横向分割的框架数目设定横向分割的框架数目 cols cols 设定纵向分割的框架数目设定纵向分割的框架数目设定纵向分割的框架数目设定纵向分割的框架数目 border border 设定边框的宽度设定边框的宽度设定边框的宽度设定边框的宽度 bordercolorbordercolor 设定边框的色彩设定边框的色彩设定边框的色彩设定边框的色彩 frameborderframeborder 设定有设定有设定有设定有 无边框

79、无边框无边框无边框 framespacingframespacing 设置各窗格间的空白设置各窗格间的空白设置各窗格间的空白设置各窗格间的空白 2.11 2.11 框架（多窗口页面）框架（多窗口页面）框架（多窗口页面）框架（多窗口页面） 框架有横向和纵向之分。对一个框架来说，其大小是很框架有横向和纵向之分。对一个框架来说，其大小是很框架有横向和纵向之分。对一个框架来说，其大小是很框架有横向和纵向之分。对一个框架来说，其大小是很重要的。重要的。重要的。重要的。的的的的rowsrows和和和和colscols属性用于设定横向分割属性用于设定横向分割属性用于设定横向分割属性用于设定横向分割和纵向分割

80、的框架数目。例如，要建立有三个横向框架的页面，和纵向分割的框架数目。例如，要建立有三个横向框架的页面，和纵向分割的框架数目。例如，要建立有三个横向框架的页面，和纵向分割的框架数目。例如，要建立有三个横向框架的页面，可写为：可写为：可写为：可写为： frameset row=x1|y1%|z1*, x2|y2%|z2*, x3|y3%|z3*2.11 2.11 框架（多窗口页面）框架（多窗口页面）框架（多窗口页面）框架（多窗口页面） 2. 2. 标记标记标记标记 标记用于给各个框架指定页面的内容，也就是，标记用于给各个框架指定页面的内容，也就是，标记用于给各个框架指定页面的内容，也就是，标记用于

81、给各个框架指定页面的内容，也就是，它将各个框架和包含其内容的那个文件联系在一起。它将各个框架和包含其内容的那个文件联系在一起。它将各个框架和包含其内容的那个文件联系在一起。它将各个框架和包含其内容的那个文件联系在一起。是一个单标记，格式为：是一个单标记，格式为：是一个单标记，格式为：是一个单标记，格式为： frame 标记的个数应等于在标记的个数应等于在标记的个数应等于在标记的个数应等于在标记中所定标记中所定标记中所定标记中所定义的框架数，并按在文件中出现的次序按先行后列对框架进行义的框架数，并按在文件中出现的次序按先行后列对框架进行义的框架数，并按在文件中出现的次序按先行后列对框架进行义的框

82、架数，并按在文件中出现的次序按先行后列对框架进行初始化。如果初始化。如果初始化。如果初始化。如果标记数目少于标记数目少于标记数目少于标记数目少于中定义的中定义的中定义的中定义的框架数量，则多余的框架为空。框架数量，则多余的框架为空。框架数量，则多余的框架为空。框架数量，则多余的框架为空。 【例例2-29】 【例例2-30】 2.11 2.11 框架（多窗口页面）框架（多窗口页面）框架（多窗口页面）框架（多窗口页面） 在很多网页中，常在一个框架中显示一个所有网页内容的在很多网页中，常在一个框架中显示一个所有网页内容的在很多网页中，常在一个框架中显示一个所有网页内容的在很多网页中，常在一个框架中显

83、示一个所有网页内容的目录，而通过单击其中的某项，在另一个框架中显示相应内容。目录，而通过单击其中的某项，在另一个框架中显示相应内容。目录，而通过单击其中的某项，在另一个框架中显示相应内容。目录，而通过单击其中的某项，在另一个框架中显示相应内容。这些目录是热点文本，需要在框架之间建立超链接，并指明显这些目录是热点文本，需要在框架之间建立超链接，并指明显这些目录是热点文本，需要在框架之间建立超链接，并指明显这些目录是热点文本，需要在框架之间建立超链接，并指明显示的目标文件的框架。示的目标文件的框架。示的目标文件的框架。示的目标文件的框架。 使用使用使用使用的的的的targettarget属性就可以

84、控制目标文件在那个框架属性就可以控制目标文件在那个框架属性就可以控制目标文件在那个框架属性就可以控制目标文件在那个框架内显示。当单击热点文本时，目标文件就会出现在有内显示。当单击热点文本时，目标文件就会出现在有内显示。当单击热点文本时，目标文件就会出现在有内显示。当单击热点文本时，目标文件就会出现在有targettarget指指指指定的框架内。定的框架内。定的框架内。定的框架内。targettarget属性的值可以为框架名，使用格式为：属性的值可以为框架名，使用格式为：属性的值可以为框架名，使用格式为：属性的值可以为框架名，使用格式为： a 热点文热点文热点文热点文本本本本 2.11 2.11

85、 框架（多窗口页面）框架（多窗口页面）框架（多窗口页面）框架（多窗口页面）2.11.2 2.11.2 框架间的链接框架间的链接框架间的链接框架间的链接 另外，另外，另外，另外，“ “框架名框架名框架名框架名” ”有有有有4 4个特殊的值，分别实现个特殊的值，分别实现个特殊的值，分别实现个特殊的值，分别实现4 4类特殊的类特殊的类特殊的类特殊的操作：操作：操作：操作： target=_blanktarget=_blank：链接的目标文件被显示在一个新的链接的目标文件被显示在一个新的链接的目标文件被显示在一个新的链接的目标文件被显示在一个新的没有名字的浏览器窗口中。没有名字的浏览器窗口中。没有名字

86、的浏览器窗口中。没有名字的浏览器窗口中。 target=_selftarget=_self：链接的目标文件被显示在当前框架窗链接的目标文件被显示在当前框架窗链接的目标文件被显示在当前框架窗链接的目标文件被显示在当前框架窗口中，代替正在显示的热点文本所在的那个文件，是省略口中，代替正在显示的热点文本所在的那个文件，是省略口中，代替正在显示的热点文本所在的那个文件，是省略口中，代替正在显示的热点文本所在的那个文件，是省略targettarget属性的默认值。属性的默认值。属性的默认值。属性的默认值。 target=_toptarget=_top：链接的目标文件被显示在整个浏览器链接的目标文件被显示

87、在整个浏览器链接的目标文件被显示在整个浏览器链接的目标文件被显示在整个浏览器窗口（取消了框架）。窗口（取消了框架）。窗口（取消了框架）。窗口（取消了框架）。 target=“_parent”target=“_parent”：当框架嵌套时，链接的目标文件被当框架嵌套时，链接的目标文件被当框架嵌套时，链接的目标文件被当框架嵌套时，链接的目标文件被显示在父框架中；否则，被显示在整个浏览器窗口中。显示在父框架中；否则，被显示在整个浏览器窗口中。显示在父框架中；否则，被显示在整个浏览器窗口中。显示在父框架中；否则，被显示在整个浏览器窗口中。【例例例例2-312-31】 2.11 2.11 框架（多窗口页

88、面）框架（多窗口页面）框架（多窗口页面）框架（多窗口页面）2.11.2 2.11.2 框架间的链接框架间的链接框架间的链接框架间的链接 网页上具有可输入表项及项目选择等控制所组成的栏目称网页上具有可输入表项及项目选择等控制所组成的栏目称网页上具有可输入表项及项目选择等控制所组成的栏目称网页上具有可输入表项及项目选择等控制所组成的栏目称为表单。在网页中，通过表单交流和反馈信息。格式为：为表单。在网页中，通过表单交流和反馈信息。格式为：为表单。在网页中，通过表单交流和反馈信息。格式为：为表单。在网页中，通过表单交流和反馈信息。格式为： form name=method=get|post input

89、 type= =y name name属性属性属性属性 : :表单的名字，在一个网页中用于惟一识别一表单的名字，在一个网页中用于惟一识别一表单的名字，在一个网页中用于惟一识别一表单的名字，在一个网页中用于惟一识别一个表单个表单个表单个表单 actionaction属性属性属性属性 : :表单处理的方式，往往是表单处理的方式，往往是表单处理的方式，往往是表单处理的方式，往往是E-mailE-mail地址或网地址或网地址或网地址或网址址址址 methodmethod属性属性属性属性: :表单数据的传送方向，是获得（表单数据的传送方向，是获得（表单数据的传送方向，是获得（表单数据的传送方向，是获得（

90、GETGET）表表表表单还是送出（单还是送出（单还是送出（单还是送出（POSTPOST）表单表单表单表单2.12 2.12 表单表单表单表单 2.12.1 2.12.1 表单的标记表单的标记表单的标记表单的标记. 使用使用使用使用标记的标记的标记的标记的typetype属性，可以在表单中加入表项，属性，可以在表单中加入表项，属性，可以在表单中加入表项，属性，可以在表单中加入表项，并控制表项的风格。并控制表项的风格。并控制表项的风格。并控制表项的风格。typetype属性值为属性值为属性值为属性值为texttext，则输入的文本以标则输入的文本以标则输入的文本以标则输入的文本以标准的字符显示；准

91、的字符显示；准的字符显示；准的字符显示；typetype属性值为属性值为属性值为属性值为passwordpassword，则输入的文本显示则输入的文本显示则输入的文本显示则输入的文本显示为为为为“*”“*”。 在表项前应加入表项的名称，如在表项前应加入表项的名称，如在表项前应加入表项的名称，如在表项前应加入表项的名称，如“ “您的姓名您的姓名您的姓名您的姓名” ”等，以告诉等，以告诉等，以告诉等，以告诉浏览者在随后的表项中输入的内容。浏览者在随后的表项中输入的内容。浏览者在随后的表项中输入的内容。浏览者在随后的表项中输入的内容。【例例例例2-322-32】 2.12 2.12 表单表单表单表单

92、 2.12.2 2.12.2 文字和密码的输入文字和密码的输入文字和密码的输入文字和密码的输入 如果浏览者想清除输入到表单中的全部内容，可以使用如果浏览者想清除输入到表单中的全部内容，可以使用如果浏览者想清除输入到表单中的全部内容，可以使用如果浏览者想清除输入到表单中的全部内容，可以使用标记中的标记中的标记中的标记中的typetype属性所设的重置（属性所设的重置（属性所设的重置（属性所设的重置（resetreset）按钮，当浏按钮，当浏按钮，当浏按钮，当浏览者完成表单的填写，想要发送时，可使用览者完成表单的填写，想要发送时，可使用览者完成表单的填写，想要发送时，可使用览者完成表单的填写，想要

93、发送时，可使用标记的标记的标记的标记的属性属性属性属性typetype所设的提交（所设的提交（所设的提交（所设的提交（submitsubmit）按钮，将表单内容送给按钮，将表单内容送给按钮，将表单内容送给按钮，将表单内容送给actionaction中的网址或函件信箱。格式为：中的网址或函件信箱。格式为：中的网址或函件信箱。格式为：中的网址或函件信箱。格式为： input type=reset value= input type=submit value= 当缺省当缺省当缺省当缺省valuevalue的设置值时，重置和提交的按钮分别显示为的设置值时，重置和提交的按钮分别显示为的设置值时，重置和提

94、交的按钮分别显示为的设置值时，重置和提交的按钮分别显示为“ “重置重置重置重置” ”和和和和“ “提交查询内容提交查询内容提交查询内容提交查询内容” ”。例如：。例如：。例如：。例如： input type=text name=a02 2.12 2.12 表单表单表单表单 2.12.3 2.12.3 重置和提交重置和提交重置和提交重置和提交 在页面中有些地方需要列出几个项目，让浏览者通过选择在页面中有些地方需要列出几个项目，让浏览者通过选择在页面中有些地方需要列出几个项目，让浏览者通过选择在页面中有些地方需要列出几个项目，让浏览者通过选择钮选择项目。选择钮可以是复选框（钮选择项目。选择钮可以是

95、复选框（钮选择项目。选择钮可以是复选框（钮选择项目。选择钮可以是复选框（checkboxcheckbox）或单选钮或单选钮或单选钮或单选钮（radioradio）。用）。用）。用）。用标记的标记的标记的标记的typetype属性可设置选择钮的类型，属性可设置选择钮的类型，属性可设置选择钮的类型，属性可设置选择钮的类型，属性属性属性属性valuevalue可设置该选择钮的控制初值，用以告诉表单制作者可设置该选择钮的控制初值，用以告诉表单制作者可设置该选择钮的控制初值，用以告诉表单制作者可设置该选择钮的控制初值，用以告诉表单制作者选择结果。用选择结果。用选择结果。用选择结果。用checkedche

96、cked表示是否为缺省选中项。表示是否为缺省选中项。表示是否为缺省选中项。表示是否为缺省选中项。namename属性是属性是属性是属性是控制名，同一组的选择钮的控制名是一样的。控制名，同一组的选择钮的控制名是一样的。控制名，同一组的选择钮的控制名是一样的。控制名，同一组的选择钮的控制名是一样的。 【例例2-33】 2.12 2.12 表单表单表单表单 2.12.4 2.12.4 复选框和单选钮复选框和单选钮复选框和单选钮复选框和单选钮 当浏览者选择的项目较多时，如果用选择钮来选择，占当浏览者选择的项目较多时，如果用选择钮来选择，占当浏览者选择的项目较多时，如果用选择钮来选择，占当浏览者选择的项

97、目较多时，如果用选择钮来选择，占页面的区域就会较多。可以用页面的区域就会较多。可以用页面的区域就会较多。可以用页面的区域就会较多。可以用标记和标记和标记和标记和标标标标记来设置选择栏。选择栏可分为两种，即弹出式和字段式。记来设置选择栏。选择栏可分为两种，即弹出式和字段式。记来设置选择栏。选择栏可分为两种，即弹出式和字段式。记来设置选择栏。选择栏可分为两种，即弹出式和字段式。标记的格式为：标记的格式为：标记的格式为：标记的格式为： select size=x name= multiple 2.12 2.12 表单表单表单表单 2.12.5 2.12.5 选择栏选择栏选择栏选择栏 其中：其中：其中

98、：其中： size size 取数字，表示在带滚动条的选择栏中一次取数字，表示在带滚动条的选择栏中一次取数字，表示在带滚动条的选择栏中一次取数字，表示在带滚动条的选择栏中一次可见的列表项数可见的列表项数可见的列表项数可见的列表项数 name name 控制操作名控制操作名控制操作名控制操作名 multiple multiple 不带值，加上本项表示可选多个选项，否不带值，加上本项表示可选多个选项，否不带值，加上本项表示可选多个选项，否不带值，加上本项表示可选多个选项，否则只能单选则只能单选则只能单选则只能单选 标记的格式为：标记的格式为：标记的格式为：标记的格式为： option select

99、 value= 其中：其中：其中：其中： select select 不带值，加上本项表示该项是预置的不带值，加上本项表示该项是预置的不带值，加上本项表示该项是预置的不带值，加上本项表示该项是预置的 value value 指定控制操作的初始值，缺省时初值为指定控制操作的初始值，缺省时初值为指定控制操作的初始值，缺省时初值为指定控制操作的初始值，缺省时初值为optionoption中的内容表示选项值中的内容表示选项值中的内容表示选项值中的内容表示选项值 【例例例例2-342-34】 2.12 2.12 表单表单表单表单 2.12.5 2.12.5 选择栏选择栏选择栏选择栏 在意见反馈栏中往往需要浏览者发表意见和建议，提供的在意见反馈栏中往往需要浏览者发表意见和建议，提供的输入区域一般较大，可以输入较多的文字。使用输入区域一般较大，可以输入较多的文字。使用标记可以设置允许成段文字的输入。格式为：标记可以设置允许成段文字的输入。格式为： 多行文本多行文本 其中的行数和列数是指不用滚动条就可看到的部分。其中的行数和列数是指不用滚动条就可看到的部分。 2.12 2.12 表单表单表单表单 2.12.6 2.12.6 多行文字的输入多行文字的输入多行文字的输入多行文字的输入textareatextarea.