网页制作基础第2章.ppt

《网页制作基础第2章.ppt》由会员分享，可在线阅读，更多相关《网页制作基础第2章.ppt（114页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、网页制作网页制作第第2章章 XHTML第第2章章 XHTMLl2.1 XHTML基础基础l2.2 body元素元素l2.3 网页文本网页文本l2.4 网页图像网页图像l2.5 网页链接网页链接l2.6 网页表格网页表格l2.7 网页表单网页表单l2.8 网页网页多媒体多媒体2.1 XHTML基础基础l2.1.1 HTMLl2.1.2 XHTML2.1.1 HTMLl1.HTMLl2.HTML文件基本结构文件基本结构1.HTML当客户从当客户从WWW服务器读取到一个网页文件后，服务器读取到一个网页文件后，客户需要在自己的显示屏幕上将它正确无误地显示客户需要在自己的显示屏幕上将它正确无误地显示出来

2、。为保证每个人在屏幕上都能读到正确显示的出来。为保证每个人在屏幕上都能读到正确显示的文件，必须以某种各类型的计算机或终端都能文件，必须以某种各类型的计算机或终端都能“看看懂懂”的方式来描述文件，于是就产生了的方式来描述文件，于是就产生了HTML超超文本标记语言（文本标记语言（Hype Text Markup Language）。）。HTML是一种基本的是一种基本的WEB设计语言，用于描述设计语言，用于描述WEB页面的内容、格式等信息，现在的各种页面的内容、格式等信息，现在的各种WEB页面都是建立在页面都是建立在HTML基础之上的。基础之上的。HTML是一种标记语言，也就是使用标记符来是一种标记

3、语言，也就是使用标记符来描述页面元素。描述页面元素。页面元素的基本格式为：页面元素的基本格式为：内容内容标记符为英文字符串，不区分大小写，描述内标记符为英文字符串，不区分大小写，描述内容代表的含义；容代表的含义；属性用于设置辅助的信息，而属性需要一个明属性用于设置辅助的信息，而属性需要一个明确的属性值来表示具体的信息。确的属性值来表示具体的信息。标记符和属性、属性和属性之间用空格间隔。标记符和属性、属性和属性之间用空格间隔。标记符为英文字符串，不区分大小写，描述内标记符为英文字符串，不区分大小写，描述内容代表的含义；容代表的含义；属性用于设置辅助的信息，而属性需要一个明属性用于设置辅助的信息，

4、而属性需要一个明确的属性值来表示具体的信息。确的属性值来表示具体的信息。标记符和属性、属性和属性之间用空格间隔。标记符和属性、属性和属性之间用空格间隔。2.HTML文件基本结构文件基本结构HTML文件无论内容多少都有一个基本结构：文件无论内容多少都有一个基本结构：我第一个网页我第一个网页 你好！你好！标记符表示该文档为标记符表示该文档为HTML文档。文档。标记符包含文档的标题、文档使用的脚标记符包含文档的标题、文档使用的脚本语言、本语言、WEB页面样式定义和页面样式定义和WEB文档信息。文档信息。标记符包含文档的标题。标记符包含文档的标题。标记符中放置要在访问者浏览器中显示标记符中放置要在访问

5、者浏览器中显示信息的所有标记符和内容。信息的所有标记符和内容。标记符中放置段落文字。标记符中放置段落文字。用于放置网页注释信息。用于放置网页注释信息。HTML 文档本身是文本格式的，用任何一种文文档本身是文本格式的，用任何一种文本编辑器都可以对它进行编辑。本编辑器都可以对它进行编辑。普通普通HTML文档的文件扩展名为文档的文件扩展名为“.html”或或“.htm”。2.1.2 XHTMLXHTML就是在就是在HTML的基础上，针对的基础上，针对XML进行进行了扩展的语言。准确地说，了扩展的语言。准确地说，XHTML是一种过渡技术，是一种过渡技术，建立建立XHTML的目的就是实现的目的就是实现H

6、TML向向XML的过渡。的过渡。XHTML是网页制作中常用的一种结构标准语言，是网页制作中常用的一种结构标准语言，通常网页的内容可以用通常网页的内容可以用XHTML代码进行结构设计。代码进行结构设计。XHTML保留了保留了HTML的大部分内容，并在此基础上的大部分内容，并在此基础上又增加了又增加了XML语言的基本规范和要求。语言的基本规范和要求。XHTML文档：文档：无标题文档无标题文档 注释：注释：“!DOCTYPE html PUBLIC”用于定义用于定义XHTML文档的文档的类型；类型；“html xmlns=http:/.”是文档的根元素，其中是文档的根元素，其中xmlns用于声明用于

7、声明XHTML文档的命名空间；文档的命名空间；“”是头部信息结构元素；是头部信息结构元素；“meta http-equiv”用于设置文档字符编码，通常设用于设置文档字符编码，通常设置成置成gb2312（简体中文语言编码）或（简体中文语言编码）或utf-8（世界通用语（世界通用语言编码）等；言编码）等；“”用于放置在浏览器标题栏中显示的内容；用于放置在浏览器标题栏中显示的内容；“”是网页主体内容元素。是网页主体内容元素。1.文档类型文档类型XHTML文档的第文档的第1行为行为元素，用元素，用于定义文档的类型。于定义文档的类型。DOCTYPE是是document type（文档类型）的简写，用于设

8、置当前文档所使（文档类型）的简写，用于设置当前文档所使用的用的XHTML的版本。的版本。现在常用的现在常用的XHTML1.0主要有主要有3种类型：种类型：严格型严格型（Strict）、过渡型（过渡型（Transitional）和和框架型框架型（Frameset）。（1）严格型（）严格型（Strict）严格型（严格型（Strict）是一种严格的）是一种严格的DTD，浏览器，浏览器在解析时要求相对严格，不允许使用任何表现样式在解析时要求相对严格，不允许使用任何表现样式的元素和属性，对于初学者而言不建议采用这种类的元素和属性，对于初学者而言不建议采用这种类型。型。（2）过渡型（）过渡型（Transi

9、tional）过渡型（过渡型（Transitional）是一种要求相对宽松）是一种要求相对宽松的的DTD过渡类型。允许使用过渡类型。允许使用HTML4.0中原有的用于中原有的用于表现的标签和属性，但必须符合表现的标签和属性，但必须符合XHTML的语法要求。的语法要求。而且此类型的文档对标签所处的位置和顺序不像而且此类型的文档对标签所处的位置和顺序不像Strict那样严格，建议初学者采用此类型。那样严格，建议初学者采用此类型。（3）框架型（）框架型（Frameset）框架型（框架型（Frameset）是一种专门针对框架页面）是一种专门针对框架页面设计使用的设计使用的DTD。如果网页中使用了框架结

10、构，就。如果网页中使用了框架结构，就要使用这种类型。要使用这种类型。2.DTDDTD主要用于规定在该主要用于规定在该XHTML文档中使用标签、文档中使用标签、属性和实体的规则。在属性和实体的规则。在XML中可以自定义标记，而中可以自定义标记，而这些标记、属性的定义都可以在这些标记、属性的定义都可以在DTD中完成。由于中完成。由于XHTML文档中不允许自定义标记，所以在所有相同文档中不允许自定义标记，所以在所有相同类型的类型的XHTML文档中使用的文档中使用的DTD都是相同的。都是相同的。DTD为为XHTML文档定义了在该文档中应该包含的或文档定义了在该文档中应该包含的或者可以包含的标记、属性和

11、实体的一个列表，以及者可以包含的标记、属性和实体的一个列表，以及它们之间的关系。它们之间的关系。3.声明命名空间声明命名空间xmlns即即xHTML namespace的缩写，可以理解为命的缩写，可以理解为命名空间或名称空间。在名空间或名称空间。在XML中是允许用户自定义元素的，设中是允许用户自定义元素的，设置不同命名空间，可以在不同命名空间中设置同名元素来代置不同命名空间，可以在不同命名空间中设置同名元素来代表不同的含义。表不同的含义。XHTML必须符合必须符合XML规则，所以在规则，所以在XHTML中要定义中要定义命名空间。而命名空间。而XHTML不允许用户自定义元素，因此在不允许用户自定

12、义元素，因此在XHTML中的命名空间的定义可以是一个统一的值，即中的命名空间的定义可以是一个统一的值，即“http:/www.w3.org/1999/xhtml”。在。在XHTML文档的根元素文档的根元素中，必须使用中，必须使用xmlns属性声明文档的命名空间。如：属性声明文档的命名空间。如：4.XHTML语法规范语法规范XHTML是是HTML向向XML过渡的一种标记语言，过渡的一种标记语言，所以它必须符合所以它必须符合XML文档的文档的规范。规范。XHTML语法规范：语法规范：要要定义文档类型，即在定义文档类型，即在中所定义中所定义的内容。的内容。在在根元素中设置根元素中设置xmlns属性，

13、即命名空间。属性，即命名空间。所有所有元素和属性都必须小写。元素和属性都必须小写。XHTML规范中禁用了规范中禁用了name属性，取而代之的是属性，取而代之的是id属性。属性。所有所有的属性都必须被赋值。的属性都必须被赋值。所有所有元素的标签都必须闭合，即使是没有结束标元素的标签都必须闭合，即使是没有结束标签的空标记也要闭合。签的空标记也要闭合。所有所有属性的属性值必须用引号括起来。属性的属性值必须用引号括起来。所有所有标签都必须合理嵌套。标签都必须合理嵌套。不能不能在注释内容中使用在注释内容中使用“-”，“-”只能出现在只能出现在注释的开始与结束。注释的开始与结束。2.2 body元素元素b

14、ody元素是元素是XHTML文档中的核心元素，用于文档中的核心元素，用于放置文档中各项内容（文字、图像、链接、表格、放置文档中各项内容（文字、图像、链接、表格、表单、音频、视频等对象）。表单、音频、视频等对象）。u格式：格式：内容内容u属性：属性：background属性：设置页面背景图片属性：设置页面背景图片bgcolor属性：设置页面背景颜色属性：设置页面背景颜色text属性：设置文字颜色属性：设置文字颜色link属性：设置链接颜色属性：设置链接颜色alink属性：设置激活链接颜色属性：设置激活链接颜色vlink属性：设置已访问过链接颜色属性：设置已访问过链接颜色leftmargin属性：

15、设置页面左边空白宽度属性：设置页面左边空白宽度topmargin属性：设置页面顶端空白属性：设置页面顶端空白XHTML文档中的颜色文档中的颜色网页中颜色采用网页中颜色采用RGB颜色体系，用红绿蓝三种颜颜色体系，用红绿蓝三种颜色组合各种颜色效果，每一种颜色用一个字节（色组合各种颜色效果，每一种颜色用一个字节（8个二个二进制位）来表示，即进制位）来表示，即2进制进制0000000011111111，16进制进制00FF，10进制的进制的0255。所以一种颜色效果用所以一种颜色效果用6位位16进制数表示，前面要进制数表示，前面要加加#。例如黄颜色为。例如黄颜色为#FFFF00。当前浏览器也可以使用颜

16、色名来定义颜色，例如：当前浏览器也可以使用颜色名来定义颜色，例如：red、green、blue、yellow等。等。代码输入：代码输入：l1.在在代码视图中直接代码视图中直接输入输入l2.利用对话框利用对话框编辑编辑无论使用何种方式编辑，最终以形成的无论使用何种方式编辑，最终以形成的XHTML代码代码在浏览器中显示的结果为准。在浏览器中显示的结果为准。2.3 网页文本网页文本网页文本是网页文本是WEB网页的信息主体。网页制作者网页的信息主体。网页制作者通过文本展示信息，而网页浏览者通过文本获取信通过文本展示信息，而网页浏览者通过文本获取信息息。l2.3.1 文本基础文本基础l2.3.2 列表列

17、表l2.3.3 其他文本元素其他文本元素l2.3.4 文本格式化文本格式化2.3.1 文本基础文本基础当当HTML文件被浏览器显示时，页面内容必须文件被浏览器显示时，页面内容必须用用HTML标记符修饰格式，而文件中的空格、制表标记符修饰格式，而文件中的空格、制表位和回车在浏览器中的显示效果与传统文本文件中位和回车在浏览器中的显示效果与传统文本文件中的效果不同。的效果不同。2.3.1 文本基础文本基础l1.段落段落l2.标题标题l3.换行换行l4.水平线水平线l5.特殊字符特殊字符1.段落段落网页中一个段落文本为一个网页中一个段落文本为一个p元素，元素，p元素之间元素之间会产生空行。在设计视图中

18、按回车键自动产生会产生空行。在设计视图中按回车键自动产生p元元素。素。u格式：格式：文字文字 u属性：属性：align属性：设置段落对齐属性：设置段落对齐属性，属性值为属性，属性值为 left、right、center和和justify（两端对齐（两端对齐）。）。2.标题标题网页中也有各级标题文本，用于描述不同级别网页中也有各级标题文本，用于描述不同级别的文本信息，也是一种段落格式效果。的文本信息，也是一种段落格式效果。XHTML使用使用h1h6元素来标示标题文本。标题元素也用于标明元素来标示标题文本。标题元素也用于标明一个网页中各个部分的层次关系。一个网页中各个部分的层次关系。标题文字默认有

19、加粗效果，标题文字默认有加粗效果，h1元素的文字最大，元素的文字最大，h6元素的文字最小。元素的文字最小。u格式：格式：文字文字 文字文字 文字文字 文字文字 文字文字 文字文字 u属性：属性：align属性：设置标题文字对齐方式，属性值属性：设置标题文字对齐方式，属性值为为left、right、center和和justify。3.换行换行在段落文本的特定位置处强行换行要使用在段落文本的特定位置处强行换行要使用br元元素，这样上下行文字之间没有空行间隔。在设计视素，这样上下行文字之间没有空行间隔。在设计视图按图按shift+enter键自动产生键自动产生br元素。元素。u格式：格式：4.水平线

20、水平线网页上的一条水平线为一个网页上的一条水平线为一个hr元素。元素。u格式：格式：u属性：属性：width属性：水平线宽度属性：水平线宽度，属性值可以，属性值可以是像素是像素数或百分比。数或百分比。size属性：水平线高度。属性：水平线高度。align属性：水平线对齐方式属性：水平线对齐方式，属性值，属性值为为left、right 和和center。noshade属性：水平线没有阴影，属性值为属性：水平线没有阴影，属性值为noshade。color属性：水平线颜色。属性：水平线颜色。5.特殊字符特殊字符XHTML语言提供了一些以语言提供了一些以&开始的助记符或数开始的助记符或数字，用于表示页

21、面中特殊字符。字，用于表示页面中特殊字符。u例如：例如： ；不换行空格不换行空格¥；￥©；<；2.3.2 列表列表l1.项目列表项目列表l2.编号列表编号列表l3.定义列表定义列表1.项目列表项目列表项目列表，即无序列表，会在列表的每个项目项目列表，即无序列表，会在列表的每个项目前加上列表符号（默认为圆点）。列表文字缩进显前加上列表符号（默认为圆点）。列表文字缩进显示。示。u格式：格式：项目项目1项目项目2项目项目3uul元素属性：元素属性：type属性：设置列表符号类型。值为属性：设置列表符号类型。值为disc（默认，圆点），（默认，圆点），square（方块），（

22、方块），circle（圆圈）。（圆圈）。2.编号列表编号列表编号列表，即有序列表，会在列表的每个项目编号列表，即有序列表，会在列表的每个项目前加上字母或数字等列表符号。前加上字母或数字等列表符号。u格式：格式：项目项目1项目项目2项目项目3uol元素属性：元素属性：type属性：设置列表编号的样式。属性值：属性：设置列表编号的样式。属性值：1：表示是十进制数，如：表示是十进制数，如1、2、3等（默认）等（默认）a：表示是小写字母，如：表示是小写字母，如a、b、c等等A：表示是大写字母，如：表示是大写字母，如A、B、C等等i：表示是小写罗马数字，如表示是小写罗马数字，如i、ii、iii等等I：表

23、示是大写罗马数字，如：表示是大写罗马数字，如I、II、III等等start属性：设置列表的起始编号。属性：设置列表的起始编号。3.定义列表定义列表定义列表用了组织术语和相关定义。术语被突定义列表用了组织术语和相关定义。术语被突出，独占一行从页边开始显示，定义从另一行开始出，独占一行从页边开始显示，定义从另一行开始并且缩进。并且缩进。格式：格式：术语术语 定义定义2.3.3 其他文本元素其他文本元素l1.预格式化文本预格式化文本l2.文本缩进文本缩进1.预格式化文本预格式化文本前面介绍的段落元素不能保留空格、制表位和前面介绍的段落元素不能保留空格、制表位和回车的效果，而为了保留这些效果，可以采用

24、回车的效果，而为了保留这些效果，可以采用pre元素来完成。元素来完成。u格式：格式：文本文本2.文本缩进文本缩进blockquote元素可以实现成块文本缩进，起到元素可以实现成块文本缩进，起到特别的强调作用。特别的强调作用。u格式：格式：文本文本2.3.4 文本格式化文本格式化l1.字体、字号、颜色字体、字号、颜色l2.逻辑样式元素逻辑样式元素l3.物理样式元素物理样式元素1.字体、字号、颜色字体、字号、颜色XHTML中使用中使用font元素来设置文字内容的字体、元素来设置文字内容的字体、字号和颜色。字号和颜色。u格式：格式：文字文字u属性：属性：face属性：设置属性：设置字体字体size属

25、性：设置字号（属性：设置字号（17，默认为，默认为3）color属性：设置颜色属性：设置颜色2.逻辑样式元素逻辑样式元素逻辑样式元素，也称为短语元素，用了标明容逻辑样式元素，也称为短语元素，用了标明容器元素中的文本的逻辑样式。不同的浏览器对这些器元素中的文本的逻辑样式。不同的浏览器对这些样式的表现方式会有不同。样式的表现方式会有不同。u格式：格式：文本文本u说明：说明：元素元素 作用作用效果效果strong加强文本加强文本加粗加粗em强调文本强调文本倾斜倾斜cite引用文本引用文本倾斜倾斜code代码文本代码文本等宽字体等宽字体dfn定义文本定义文本倾斜倾斜kbd输入文本输入文本等宽字体等宽字

26、体samp示例文本示例文本等宽字体等宽字体var变量文本变量文本倾斜倾斜3.物理样式元素物理样式元素物理样式元素，也称为字体样式元素，为浏览物理样式元素，也称为字体样式元素，为浏览器提供了特定的字体指令。器提供了特定的字体指令。u格式：格式：文本文本u说明：说明：元素元素作用作用效果效果b加粗文本加粗文本加粗加粗i强调文本强调文本倾斜倾斜big加大文本加大文本比正常字体大比正常字体大small 缩小文本缩小文本比正常字体小比正常字体小sub下标文本下标文本文本变小，低于基线显示文本变小，低于基线显示sup上标文本上标文本文本变小，高于基线显示文本变小，高于基线显示strike 文本删除线文本删

27、除线添加删除线添加删除线s文本删除线文本删除线添加删除线添加删除线u文本下划线文本下划线添加下划线添加下划线tt电报文本电报文本用报文或等宽字体显示用报文或等宽字体显示2.4 网页图像网页图像l2.4.1 图像图像类型类型l2.4.2 图像元素图像元素2.4.1 图像类型图像类型网页图像也是网页图像也是WEB页面中主要信息对象，它不页面中主要信息对象，它不仅可以作为页面的主要装饰方式，而且也是网页信仅可以作为页面的主要装饰方式，而且也是网页信息的一种表现方式。息的一种表现方式。网页中的图像主要是三种类型：网页中的图像主要是三种类型：GIF、JPEG和和PNG。1.GIF图像图像GIF（Comp

28、uServe Graphical Interchange Format，可交换的图像文件格式），最大颜色数为，可交换的图像文件格式），最大颜色数为256色（色（8位色），通常用于纯色调图片和简单图片。位色），通常用于纯色调图片和简单图片。GIF图片文件扩展名为图片文件扩展名为.gif。GIF图片可以实现图片透明效果，而且一个图片可以实现图片透明效果，而且一个GIF文件中可以存多幅彩色图像，如果把存于一个文件文件中可以存多幅彩色图像，如果把存于一个文件中的多幅图像数据逐幅读出并显示到屏幕上，就可中的多幅图像数据逐幅读出并显示到屏幕上，就可构成一种最简单的动画。构成一种最简单的动画。2.JPEG图

29、像图像JPEG（Joint Photographic Experts Group，联合图像专家组），最大颜色数为，联合图像专家组），最大颜色数为1677万色（万色（24位色），通常用于照片图像。位色），通常用于照片图像。JPEG图片不能设置图片不能设置透明，不能用于动画。透明，不能用于动画。JPEG图片的文件扩展名为图片的文件扩展名为.jpg。3.PNG图像图像PNG(Portable Network Graphic Format，流式网络图形格式流式网络图形格式)，是一种位图文件，是一种位图文件(bitmap file)存储格式。存储格式。PNG用来存储灰度图像时，灰度图像的用来存储灰度图像

30、时，灰度图像的深度可多到深度可多到16位，存储彩色图像时，彩色图像的深位，存储彩色图像时，彩色图像的深度可多到度可多到48位，并且还可存储多到位，并且还可存储多到16位的位的通道数通道数据。据。PNG使用从使用从LZ77派生的无损数据压缩算法。派生的无损数据压缩算法。一般应用于一般应用于JAVA程序中，或网页或程序中，或网页或S60程序中是因程序中是因为它压缩比高，生成文件容量小。为它压缩比高，生成文件容量小。2.4.2 图像元素图像元素网页中的图像使用网页中的图像使用img元素进行描述。元素进行描述。u格式：格式：u属性：属性：src属性：图像的文件位置属性：图像的文件位置width属性：图

31、像宽度属性：图像宽度height属性：图像高度属性：图像高度图像宽度、高度改变后图像源文件不变。图像宽度、高度改变后图像源文件不变。alt属性：图像替换文字属性：图像替换文字border属性：图像边框属性：图像边框vspace属性：垂直边距属性：垂直边距hspace属性：水平边距属性：水平边距lowsrc属性：在图像显示出来之前，显示一幅属性：在图像显示出来之前，显示一幅同样内容但是分辨率低的图像同样内容但是分辨率低的图像align属性：属性：图片与周围对象的垂直对齐方式图片与周围对象的垂直对齐方式id属性：网页上对象标识，最好不要重复属性：网页上对象标识，最好不要重复name属性：网页上对象

32、标识，可以重复属性：网页上对象标识，可以重复2.5 网页链接网页链接超链接（超链接（hyperlink）是网络的灵魂，完善的链）是网络的灵魂，完善的链接会使网站或网页无所不达、无处不在。它提供了接会使网站或网页无所不达、无处不在。它提供了相关联文件的路径，以指向在相关联文件的路径，以指向在WWW网络上存储的网络上存储的文件。文件。链接在网页的表现为：当鼠标指针移动到网页链接在网页的表现为：当鼠标指针移动到网页上的链接时，鼠标指针变成手型，单击可以完成链上的链接时，鼠标指针变成手型，单击可以完成链接转向，右击在快捷菜单中选择属性，可以看到链接转向，右击在快捷菜单中选择属性，可以看到链接的目标地址

33、。接的目标地址。2.5 网页链接网页链接l2.5.1 链接链接元素元素l2.5.2 链接类型链接类型2.5.1 链接元素链接元素网页链接使用网页链接使用a元素进行描述。元素进行描述。u格式：格式：文字或图片文字或图片u属性：属性：href属性：指定链接文件位置。属性：指定链接文件位置。target属性：指定链接文件打开位置属性：指定链接文件打开位置。其中属。其中属性值性值“_blank”表示表示打开一个新窗口。打开一个新窗口。2.5.2 链接类型链接类型l1.站点外部链接站点外部链接l2.站点内部链接站点内部链接l3.页面锚点链接页面锚点链接l4.电子邮件链接电子邮件链接l5.文件下载链接文件

34、下载链接l6.空链接空链接l7.图像映射链接图像映射链接1.站点外部链接站点外部链接主要用于创建指向其他网站资源的链接。主要用于创建指向其他网站资源的链接。u格式：格式：文字或图片文字或图片u例子：例子：山东大山东大学学2.站点内部链接站点内部链接主要用于创建站点内部资源的链接。主要用于创建站点内部资源的链接。u格式：格式：文字或图片文字或图片u例子：例子：fireworks3.页面锚点链接页面锚点链接页面锚点链接主要用于访问网页内部某一特定页面锚点链接主要用于访问网页内部某一特定位置。位置。完成步骤：完成步骤：（1）网页页面添加锚点）网页页面添加锚点（2）建立链接指向锚点）建立链接指向锚点（

35、1）网页页面添加锚点）网页页面添加锚点使用使用a元素的元素的name属性，在网页页面某处进行属性，在网页页面某处进行锚点标记。锚点标记。u格式格式:文字或图片文字或图片如果没有如果没有href属性，则属性，则a标记符中间可为空。标记符中间可为空。这是在这是在HTML中常用的方法。中常用的方法。在在XHTML中推荐使用元素的中推荐使用元素的id属性，各个元素属性，各个元素都可以有都可以有id属性，所以可以不限定元素。属性，所以可以不限定元素。u格式：格式：内容内容（2）建立链接指向锚点）建立链接指向锚点u格式：格式：文本或图片文本或图片target对应页面对应页面a元素的元素的name属性值或某

36、页面属性值或某页面元素的元素的id属性值。属性值。4.电子邮件链接电子邮件链接电子邮件链接在网页中建立邮件链接，单击此电子邮件链接在网页中建立邮件链接，单击此链接会自动打开浏览器设置的默认邮件程序。链接会自动打开浏览器设置的默认邮件程序。u格式：格式：文本或图片文本或图片u例如：例如：文文本或图片本或图片u说明：说明：如果要使用如果要使用mailto同时实现多个功能的话，第同时实现多个功能的话，第一个功能必须以一个功能必须以“?”开头，后面的每一个功能都以开头，后面的每一个功能都以“&”开头；另外，开头；另外，cc后为抄送地址，后为抄送地址，bcc后为暗后为暗送地址，送地址，subject后为

37、邮件的主题，后为邮件的主题，body后为邮件后为邮件的内容。的内容。5.文件下载链接文件下载链接文件下载链接主要用于通过文件下载链接主要用于通过WEB方式下载文件。方式下载文件。其实文件下载链接和其他网页间链接没什么区别，其实文件下载链接和其他网页间链接没什么区别，主要是链接的文件的区别。主要是链接的文件的区别。如果普通网页浏览者的浏览器访问的链接对象如果普通网页浏览者的浏览器访问的链接对象是网页、图片、是网页、图片、flash动画等文件对象，则浏览器会动画等文件对象，则浏览器会显示相应对象；如果链接对象是显示相应对象；如果链接对象是rar、zip、exe等文等文件对象，则浏览器会出现提示下载

38、文件的对话框。件对象，则浏览器会出现提示下载文件的对话框。6.空链接空链接空链接是未指派链接目标的链接。空链接用于空链接是未指派链接目标的链接。空链接用于向页面上的对象或文本附加行为。向页面上的对象或文本附加行为。u格式：格式：文字或图片文字或图片7.图像映射链接图像映射链接图像可以单独成为触发链接的对象，也可以将图像可以单独成为触发链接的对象，也可以将图像部分区域作为触发链接的对象。这些图像的部图像部分区域作为触发链接的对象。这些图像的部分区域称为分区域称为“热点热点”，每一个，每一个“热点热点”就是一个映就是一个映射，不同热点可以链接不同的网页资源。射，不同热点可以链接不同的网页资源。完成

39、图像映射链接用到完成图像映射链接用到area元素和元素和map元素，元素，使用编辑代码方式完成很麻烦，可以通过使用编辑代码方式完成很麻烦，可以通过Dreamweaver的工具完成。的工具完成。在在Dreamweaver设计视图中，选择制作图像映设计视图中，选择制作图像映射链接的图像，然后通过属性面板上的按钮完成操射链接的图像，然后通过属性面板上的按钮完成操作。作。2.6 网页表格网页表格网页表格由行和列组成，行和列的交汇处称为网页表格由行和列组成，行和列的交汇处称为单元格。单元格。网页上的表格的使用通常有两种方式：（网页上的表格的使用通常有两种方式：（1）组织数据；（组织数据；（2）网页布局。

40、）网页布局。2.6 网页表格网页表格l2.6.1 表格基本结构表格基本结构l2.6.2 表格表格l2.6.3 表格行表格行l2.6.4 标题单元格和普通单元格标题单元格和普通单元格2.6.1 表格基本结构表格基本结构 2.6.2 表格表格table元素用来标识页面一个表格。元素用来标识页面一个表格。u属性：属性：width属性：表格宽度属性：表格宽度height属性：表格高度属性：表格高度border属性：边框大小属性：边框大小bordercolor属性：边框颜色属性：边框颜色cellpadding属性：单元格内容与边框距离属性：单元格内容与边框距离cellspacing属性：单元格之间距离属

41、性：单元格之间距离background属性：背景图片属性：背景图片bgcolor属性：背景颜色属性：背景颜色align属性：指定表格的水平对齐方式。属性值属性：指定表格的水平对齐方式。属性值为为left、right和和center。2.6.3 表格行表格行tr元素用来标识表格中的一行。元素用来标识表格中的一行。u属性：属性：align属性：行内所有单元格内容水平对齐方式属性：行内所有单元格内容水平对齐方式valign属性：行内所有单元格内容垂直对齐方属性：行内所有单元格内容垂直对齐方式式。属性值。属性值为为top、middle和和bottombgcolor属性：行内所有单元格背景颜色属性：行内

42、所有单元格背景颜色2.6.4 标题单元格和普通单元格标题单元格和普通单元格th元素用来标识标题单元格，元素用来标识标题单元格，td元素用来标识元素用来标识普通单元格。普通单元格。th元素内容加粗居中显示。元素内容加粗居中显示。u属性：属性：align属性：单元格内容水平对齐方式属性：单元格内容水平对齐方式valign属性：单元格内容垂直对齐方式属性：单元格内容垂直对齐方式bordercolor属性：单元格边框颜色属性：单元格边框颜色width属性：单元格宽度属性：单元格宽度height属性：单元格高度属性：单元格高度background属性：单元格背景图片属性：单元格背景图片bgcolor属性

43、：单元格背景颜色属性：单元格背景颜色rowspan属性：设置单元格所跨的行数属性：设置单元格所跨的行数colspan属性：设置单元格所跨的列数属性：设置单元格所跨的列数2.7 网页表单网页表单网页表单主要用于收集用户信息，实现浏览者同网页表单主要用于收集用户信息，实现浏览者同WWW服务器之间的交互。通过表单，可以将用户的信服务器之间的交互。通过表单，可以将用户的信息发送到息发送到WWW服务器上，以供处理。服务器上，以供处理。网页表单中通常包含表单普通内容、表单控件以及网页表单中通常包含表单普通内容、表单控件以及表单控件标签等。表单控件标签等。表单普通内容主要指表单中的说明文字或图片等。表单普通

44、内容主要指表单中的说明文字或图片等。表单控件主要指表单中接收用户数据的表单元素。表单控件主要指表单中接收用户数据的表单元素。表单控件标签主要指控件的文字标识。表单控件标签主要指控件的文字标识。表单和表单控件要设置合理的表单和表单控件要设置合理的id属性值和属性值和name属性值。属性值。id 属性值用于页面内的访问，页面唯一。属性值用于页面内的访问，页面唯一。name属性值用于页面内表单专用访问和发送属性值用于页面内表单专用访问和发送服务器时使用，可重复。服务器时使用，可重复。2.7 网页表单网页表单l2.7.1 表单表单l2.7.2 基本表单控件基本表单控件l2.7.3 改善表单改善表单2.

45、7.1 表单表单表单元素是容器控件，关于相关信息调查的表表单元素是容器控件，关于相关信息调查的表单控件都要放到同一个表单元素里。单控件都要放到同一个表单元素里。u格式：格式：u属性：属性：action属性：属性值通常为服务器端的某个程属性：属性值通常为服务器端的某个程序或脚本文件的序或脚本文件的URL，这个文件接受客户端传来的，这个文件接受客户端传来的表单信息，并进行处理。表单信息，并进行处理。method属性：指定表单数据发送给服务器端属性：指定表单数据发送给服务器端的发送方式。属性值为的发送方式。属性值为get（默认值）或（默认值）或post。get：将表单数据附加到：将表单数据附加到ac

46、tion属性指定属性指定URL之后，发送给服务器。之后，发送给服务器。post：将表单数据包含在：将表单数据包含在HTTP反馈主体中，反馈主体中，发送给服务器，数据发送给服务器，数据隐蔽，隐蔽，W3C推荐方式。推荐方式。2.7.2 基本表单基本表单控件控件表单控件元素是表单元素中用于接收用户信息表单控件元素是表单元素中用于接收用户信息的对象控件的对象控件。1.单行文本框单行文本框2.密码输入框密码输入框3.单选按钮单选按钮4.复选框复选框5.滚动文本框滚动文本框6.选择列表选择列表7.提交按钮提交按钮8.重置按钮重置按钮9.按钮按钮1.单行文本框单行文本框u功能：功能：用于接收文本或数字信息。

47、用于接收文本或数字信息。u格式：格式：u属性：属性：size属性：设置文本框显示的宽度，值为数字。属性：设置文本框显示的宽度，值为数字。maxlength属性：设置文本框所接收文本的最属性：设置文本框所接收文本的最大长度，值为数字。大长度，值为数字。value属性：设置文本框初始值。属性：设置文本框初始值。2.密码输入框密码输入框u功能：功能：用于接收在输入过程中需要隐藏的数据。用于接收在输入过程中需要隐藏的数据。u格式：格式：u属性：属性：size属性：设置密码框显示的宽度，值为数字。属性：设置密码框显示的宽度，值为数字。maxlength属性：设置密码框所接收文本的最属性：设置密码框所接收

48、文本的最大长度，值为数字。大长度，值为数字。3.单选按钮单选按钮u功能：功能：允许用户从一组事先确定的选项中选择唯一项。允许用户从一组事先确定的选项中选择唯一项。u格式：格式：u属性：属性：checked属性：将单选按钮设置为默认选中状态，属性：将单选按钮设置为默认选中状态，值为值为checked。u注意：注意：同一组单选按钮的同一组单选按钮的name属性必须相同。属性必须相同。4.复选框复选框u功能：功能：允许用户从一组事先确定的选项中选择一项允许用户从一组事先确定的选项中选择一项或多项。或多项。u格式：格式：u属性：属性：checked属性：将复选框设置为默认选中状属性：将复选框设置为默认

49、选中状态，值为态，值为checked。5.滚动文本框滚动文本框u功能：功能：用于接收输入的多行文本信息。用于接收输入的多行文本信息。u格式：格式：默认文本默认文本u属性：属性：cols属性：设置滚动文本框宽度，值为数字。属性：设置滚动文本框宽度，值为数字。rows属性：设置滚动文本框行数，值为数字。属性：设置滚动文本框行数，值为数字。6.选择列表选择列表u功能：功能：允许用户从一组事先确定的列表中选择一项或多允许用户从一组事先确定的列表中选择一项或多项。项。u格式：格式：选项一选项一 选项二选项二 选项三选项三uselect元素属性：元素属性：size属性：设置显示的选项个数，值为数字。属性：

50、设置显示的选项个数，值为数字。multiple属性：设置为允许多选。值为属性：设置为允许多选。值为multiple。uoption元素属性：元素属性：selected属性：将选项设置为默认选中状态。属性：将选项设置为默认选中状态。7.提交按钮提交按钮u功能：功能：单击提交按钮用于提交表单。单击提交按钮用于提交表单。u格式：格式：u属性：属性：value属性：设置提交按钮上显示的文本。属性：设置提交按钮上显示的文本。8.重置按钮重置按钮u功能：功能：单击重置按钮用于将表单各元素重置为初始单击重置按钮用于将表单各元素重置为初始值。值。u格式：格式：u属性：属性：value属性：设置重置按钮上显示的