第4章电子商务网站建设

1、4.3 4.2 电子商务网站的实施电子商务网站的实施4.1 电子商务网站的策划电子商务网站的策划第第4章章 电子商务网站的建设电子商务网站的建设4.1 电子商务网站的策划电子商务网站的策划1. 确定网站的服务对象确定网站的服务对象3. 确定网站的内容确定网站的内容4. 确定网站的功能确定网站的功能2. 确定网站的目标确定网站的目标5. 确定网站的装饰风格确定网站的装饰风格1. 确定网站的服务对象确定网站的服务对象 由于网站资源有限，因此必须整合聚焦服务识别访问者范围。由于网站资源有限，因此必须整合聚焦服务识别访问者范围。外部访问者外部访问者客户：了解产品信息、订购、反馈客户：了解产品信息、订购

2、、反馈供应商：了解公司产品计划、分析库存供应商：了解公司产品计划、分析库存竞争者：了解公司战略和经营情况竞争者：了解公司战略和经营情况过客：值得访问信息（潜在客户）过客：值得访问信息（潜在客户）政府、其它组织和个人、投资者、债权者政府、其它组织和个人、投资者、债权者。内部访问者内部访问者经常被忽略，仅限于企业的内部经常被忽略，仅限于企业的内部按照价值链和业务流程确定：按照价值链和业务流程确定：研究部：了解客户的偏好研究部：了解客户的偏好制造部：了解客户对产品评价制造部：了解客户对产品评价市场部：利用反馈信息制定特别促销方案市场部：利用反馈信息制定特别促销方案财务部：了解客户定货和回款情况财务部

3、：了解客户定货和回款情况采购部：了解客户对产品（原料）评价采购部：了解客户对产品（原料）评价2. 确定网站的目标确定网站的目标公司的任务或目标（公司的任务或目标（Why）补充（辅助）、尝试性、转型（战略调整）补充（辅助）、尝试性、转型（战略调整）推广企业的产品和服务树立企业的形象，宣传企业的产品开展电子商务业务，并为各种客户提供服务和支持3. 确定网站的内容确定网站的内容静态内容：静态内容：一般、常规的信息，包括公司的历史、文化、所属行业等。一般、常规的信息，包括公司的历史、文化、所属行业等。较长时间内不需修改，通常在建设初期编制较长时间内不需修改，通常在建设初期编制。动态内容：动态内容：公司

4、产品和服务的有关信息。公司产品和服务的有关信息。经常变动，保持网站的吸引力，通常用作促销手段。经常变动，保持网站的吸引力，通常用作促销手段。4. 确定网站的功能确定网站的功能网站的功能可分为主要功能和辅助功能：网站的功能可分为主要功能和辅助功能：主要功能：主要功能：信息发布、网上交易信息发布、网上交易辅助功能：辅助功能：配合主要功能而设置的。如客户注册管理、客户的配合主要功能而设置的。如客户注册管理、客户的互动等。互动等。5. 确定网站的装饰风格确定网站的装饰风格装饰风格要注意形式服从内容与功能的需要装饰风格要注意形式服从内容与功能的需要装饰可分为如下三种类型：装饰可分为如下三种类型：组织性装

5、饰：组织性装饰： 按照小组、系统的结构安排站点功能，如子站点按照小组、系统的结构安排站点功能，如子站点 安排布局、颜色基调（整体）安排布局、颜色基调（整体）功能性装饰：功能性装饰： 方便顾客利用，如功能、内容的布局安排（局部）方便顾客利用，如功能、内容的布局安排（局部）可视性装饰：可视性装饰： 起着美化界面，如用图形等（部件）起着美化界面，如用图形等（部件）4.2 电子商务网站的实施电子商务网站的实施1.电子商务网站的实施方式电子商务网站的实施方式3.电子商务网站的开发电子商务网站的开发4.电子商务网站的维护电子商务网站的维护2.电子商务网站的实施准备电子商务网站的实施准备1. 实施方式实施方

6、式 - - 外包？外包？ - - 租借？租借？ - - 自建？自建？ 外包外包指全权委托外部专业化公司提供一揽子解决方案指全权委托外部专业化公司提供一揽子解决方案，并且实施。，并且实施。 租借租借指向电子商务服务站点（指向电子商务服务站点（ASPASP）租借存储空间建）租借存储空间建设站点。企业只需要提供有关材料，维护、收款以及设站点。企业只需要提供有关材料，维护、收款以及物流配送由门户站点提供。物流配送由门户站点提供。 自建指自建指利用企业自身的技术力量，按照电子商务网站利用企业自身的技术力量，按照电子商务网站的计划书，来设计、开发、维护、推广网站。的计划书，来设计、开发、维护、推广网站。2

7、. 实施准备实施准备(1)Web服务器建设服务器建设(2)准备站点资料准备站点资料(3)选择网站开发工具选择网站开发工具 虚拟主机托管虚拟主机托管整机托管整机托管租用网页空间租用网页空间独立服务器独立服务器 资料内容资料内容根据站点内容和功能规划选定材料根据站点内容和功能规划选定材料网站形象网站形象策划网站整体形象，统筹安排网页的风格策划网站整体形象，统筹安排网页的风格网页内容网页内容公司简介、产品资料（图片、价格）公司简介、产品资料（图片、价格）其它资料其它资料增值服务信息资料（相关产品技术资料、增值服务信息资料（相关产品技术资料、市场行情信息等）市场行情信息等）材料类型材料类型文字、图像、

8、动画、声音、影视等文字、图像、动画、声音、影视等网页设计工具：网页设计工具：FrontPage、DreamWeaver图像处理工具：图像处理工具： Photoshop声音、影视处理软件声音、影视处理软件交互式动态页面设计工具：交互式动态页面设计工具：微软微软ASP开发系统，开发系统，Perl开开 发系统发系统3. 网站开发网站开发企业电子商务站点的页面组成主要包括：企业电子商务站点的页面组成主要包括：主页、企业信息、新闻、产品服务、帮助、相关虚拟社区等页面主页、企业信息、新闻、产品服务、帮助、相关虚拟社区等页面主页风格：主页风格： * * 导航型导航型 提供简洁、清晰的网站结构，树立企业的网上

9、形象提供简洁、清晰的网站结构，树立企业的网上形象 * * 内容展示型内容展示型 展示主要内容，提供直接、快捷的链接，一步到位展示主要内容，提供直接、快捷的链接，一步到位 * * 视觉效果视觉效果 文本型和图片型文本型和图片型 文本型追求简洁、快速，辅以图片；文本型追求简洁、快速，辅以图片； 图片型美观、下载速度较慢。图片型美观、下载速度较慢。3. 网站开发网站开发1 1）电子商务网站的主页）电子商务网站的主页企业名称、标志、铭牌、网站图标（企业名称、标志、铭牌、网站图标（LogoLogo）等要素）等要素企业站点的网址企业站点的网址企业站点的导航系统企业站点的导航系统企业产品和企业产品和/ /或

10、服务最新的信息、有关新闻或服务最新的信息、有关新闻企业的联系方式如企业的联系方式如E-mailE-mail、电话、传真等、电话、传真等相关站点的链接相关站点的链接2 2）电子商务网站的新闻页面）电子商务网站的新闻页面产品或服务的最新信息，如品种、价格、实现方式等产品或服务的最新信息，如品种、价格、实现方式等新项目的进行情况新项目的进行情况企业的内部变动情况企业的内部变动情况行业的最新动态行业的最新动态相关行业的情况相关行业的情况3. 网站开发网站开发3 3）产品）产品/ /服务页面服务页面 产品产品/ /服务介绍服务介绍 分为两部分：分为两部分： 栏目入口处和转入具体页面后的产品栏目入口处和转

11、入具体页面后的产品介绍介绍 提供相关信息，尽可能详细，采用多媒体形式展示，提供相关信息，尽可能详细，采用多媒体形式展示， 虚拟现实虚拟现实 访问者、客户评价，访问者、客户评价，BBSBBS 在线订购和支付在线订购和支付 定制订购，定制订购，如提供购物篮（车）等形象订购系统、如提供购物篮（车）等形象订购系统、 选取系统、配送系统、支付系统（如货款、运费、选取系统、配送系统、支付系统（如货款、运费、 手续手续费计算）等，重点考虑方便、安全、自动。费计算）等，重点考虑方便、安全、自动。 产品相关信息，产品使用小常识等产品相关信息，产品使用小常识等 页面设计组织时要尽量简洁，按产品线页面设计组织时要尽

12、量简洁，按产品线/ /品牌分类。品牌分类。3. 网站开发网站开发4 4）企业信息页面）企业信息页面 功能与作用功能与作用 对公众（客户、投资者）发布企业公开信息对公众（客户、投资者）发布企业公开信息 发布信息包括发布信息包括 * * 发展历程、企业大事记发展历程、企业大事记 * * 组织架构、业务范围组织架构、业务范围 * * 合作伙伴、发展计划合作伙伴、发展计划 * * 财务信息（上市公司）财务信息（上市公司） 页面设计：最好图文并茂，采用多媒体方式展示页面设计：最好图文并茂，采用多媒体方式展示3. 网站开发网站开发5 5）帮助页面）帮助页面功能和作用功能和作用 方便浏览者在繁杂的方便浏览者

13、在繁杂的Web页面快速找到信息页面快速找到信息信息方面帮助信息方面帮助 * 站点结构图（站点结构图（Site Map）：展示主要链接）：展示主要链接 * 站点内容搜索站点内容搜索电子商务活动方面帮助电子商务活动方面帮助 * 在线订购、定制规则在线订购、定制规则 * 在线支付方式和具体方法在线支付方式和具体方法 * 物流配送方式物流配送方式3. 网站开发网站开发6 6）虚拟社区）虚拟社区虚拟社区的作用虚拟社区的作用 培养访问者的忠诚度；培养访问者的忠诚度； 供消费者交流购物体验，供消费者交流购物体验， 增加人气，建立访问者之间的群体关系增加人气，建立访问者之间的群体关系提供功能提供功能 * 个人

14、电子信箱 * 公告栏（BBS） * 在线聊天室（Chat） * 在线实时通信（ICQ）电子虚拟社区的建立电子虚拟社区的建立选择独具特色的话题，一般与企业的产品、服务、经选择独具特色的话题，一般与企业的产品、服务、经营方式相关。营方式相关。 选择合适的论坛主持人。选择合适的论坛主持人。4. 网站维护网站维护电子商务网站维护的任务：电子商务网站维护的任务： 保持链接的有效性保持链接的有效性 及时更换信息，根据信息性质不同确定更换频率，保及时更换信息，根据信息性质不同确定更换频率，保 持信息的时效性，最好是规划、持信息的时效性，最好是规划、 落实到具体部门，与落实到具体部门，与业务整合在一起业务整合

15、在一起 保持页面内容和拼写正确保持页面内容和拼写正确 维持与访问者的良好关系，及时反馈维持与访问者的良好关系，及时反馈4.3 网页的设计与制作网页的设计与制作1. 网页制作的主要软件工具网页制作的主要软件工具3. HTML常用标记常用标记2. HTML概述概述1. 网页制作的主要软件工具网页制作的主要软件工具网页设计软件网页设计软件Dreamweaver Dreamweaver是一款是一款“所见即所得所见即所得”的网页编辑工具的网页编辑工具，其用户界面非常友好易用，为网页设计者带来了，其用户界面非常友好易用，为网页设计者带来了很大的便利。很大的便利。 Dreamweaver不仅提供了强大的网页

16、编辑功能，而且不仅提供了强大的网页编辑功能，而且提供了善的站点管理机制，是一个集网页创作和站提供了善的站点管理机制，是一个集网页创作和站点管理两大利器于一身的创作工具。点管理两大利器于一身的创作工具。1. 网页制作的主要软件工具网页制作的主要软件工具动画设计软件动画设计软件Flash Flash是一款优秀的网页动画制作软件，主要应用是一款优秀的网页动画制作软件，主要应用于网页设计和多媒体创作等领域。于网页设计和多媒体创作等领域。Flash可以很方便地可以很方便地将音乐、声效、图画以及动画随心所欲地结合起来。将音乐、声效、图画以及动画随心所欲地结合起来。Flash生成的生成的SWF作品文件作品文

17、件“体积体积”小得出奇，并小得出奇，并且可以以插件的形式直接插入到网页中，是目前网络且可以以插件的形式直接插入到网页中，是目前网络中最常用的动画格式。中最常用的动画格式。1. 网页制作的主要软件工具网页制作的主要软件工具网页图形处理软件网页图形处理软件Fireworks Fireworks是一款真正的网页图形图像处理软件，是一款真正的网页图形图像处理软件，它与它与Dreamweaver结合很紧密结合很紧密 。Fireworks可用于设计动态按钮等网页元素，甚至可用于设计动态按钮等网页元素，甚至可直接设计精美的网站首页。可直接设计精美的网站首页。1. 网页制作的主要软件工具网页制作的主要软件工具

18、图像处理软件图像处理软件Photoshop Photoshop是一款专业的图像处理软件，功能强大，是一款专业的图像处理软件，功能强大，为美工设计人员提供了广阔的创意空间，为美工设计人员提供了广阔的创意空间， Photoshop广泛应用于网页图像编辑、桌面出版、广广泛应用于网页图像编辑、桌面出版、广告设计、婚纱摄影等各行各业，成为许多涉及图像处理告设计、婚纱摄影等各行各业，成为许多涉及图像处理的行业的事实标准。的行业的事实标准。 2. HTML概述概述HTML是是Hyper Text Markup Language的缩写，的缩写，即即超文本标记语言。超文本标记语言。HTML语言是网页制作的基础语

19、言，因为无论使用语言是网页制作的基础语言，因为无论使用什么工具制作网页，生成的网页代码都是以什么工具制作网页，生成的网页代码都是以HTML语语言为基础的。言为基础的。HTML与操作系统平台的选择无关，只要有浏览器与操作系统平台的选择无关，只要有浏览器就可以运行就可以运行HTML文档，显示网页内容。文档，显示网页内容。 HTML使用了一些约定的标记，对网页上的各种信使用了一些约定的标记，对网页上的各种信息进行标记，浏览器会自动根据这些标记，在屏幕上息进行标记，浏览器会自动根据这些标记，在屏幕上显示出相应的内容，而标记符号不会在屏幕上显示出显示出相应的内容，而标记符号不会在屏幕上显示出来。来。3.

20、 HTML常用标记常用标记HTML文档包含两种类型的信息：文档包含两种类型的信息： 标记信息：标记信息：该部分信息用来控制文档内部的显示该部分信息用来控制文档内部的显示方式，并允许设计人员指定与其他文档的链接。方式，并允许设计人员指定与其他文档的链接。 内容信息：内容信息：该部分信息就是浏览器显示的文本、图该部分信息就是浏览器显示的文本、图形、音频和视频等。形、音频和视频等。3. HTML常用标记常用标记HTML文档包含两种类型的信息：文档包含两种类型的信息：标记信息：标记信息：该部分信息用来控制文档内部的显示方式，该部分信息用来控制文档内部的显示方式，并允许设计人员指定与其他文档的链接。并允

21、许设计人员指定与其他文档的链接。用两个尖括号用两个尖括号“”括起来，前一个标记是起始标记，后一个括起来，前一个标记是起始标记，后一个标记为结束标记，结束标记以符号标记为结束标记，结束标记以符号“/”开头。开头。 一般是双标记。如粗体字标记一般是双标记。如粗体字标记和和 。内容信息：内容信息：该部分信息就是浏览器显示的文本、图形、该部分信息就是浏览器显示的文本、图形、音频和视频等。音频和视频等。v某些标记为单标记，只需单独使用就能完整地表达某些标记为单标记，只需单独使用就能完整地表达意思。如意思。如换行标记换行标记。v一些标记有自己的一些标记有自己的属性属性，属性细分了标记的功能，属性细分了标记

22、的功能，属性通常可以赋予具体的属性通常可以赋予具体的属性值属性值 。如：如： 是正文标记是正文标记 属性值，这里是颜色值属性值，这里是颜色值(粉红色粉红色) bgcolor就是就是标记的属性，用于设置背景色标记的属性，用于设置背景色 3. HTML常用标记常用标记如果一个标记有多个属性，属性和属性之间用空格隔开如果一个标记有多个属性，属性和属性之间用空格隔开 。标记在使用时，应注意以下几点：标记在使用时，应注意以下几点： HTML标记不区分大小写 使用“”标记将HTML文档中注解内容括起来 各标记可以嵌套，但不能交错。 如 是错误的 对于HTML文档中错误的标记及其属性，浏览器通常会跳过它，不

23、处理也不显示。 3. HTML常用标记常用标记HTML文档的基本架构文档的基本架构 v HTML文档的基本结构如下：文档的基本结构如下： 文件开始标记 文件头信息 文件体信息 文件结束标记3. HTML常用标记常用标记v 另外，基本结构标记还有另外，基本结构标记还有网页标题标记网页标题标记。 ： 该标记位于该标记位于标记中，标记内的文字显示标记中，标记内的文字显示在浏览器的标题栏上。在浏览器的标题栏上。v 有很多属性，可以定义页面的背景图像、背景色有很多属性，可以定义页面的背景图像、背景色彩、文字色彩、超文本链接的色彩等。这些属性用于设定彩、文字色彩、超文本链接的色彩等。这些属性用于设定网页的

24、总体风格。网页的总体风格。 3. HTML常用标记常用标记v 以下介绍以下介绍标记的常用属性：标记的常用属性： bgcolor：设置网页的背景色； text：设置非链接的文本色彩； link：设置未被访问过的超链接文本的色彩，默认为蓝色； alink：设置超链接文本在被访问瞬间的色彩，默认为蓝色； vlink：设置已访问过的超链接文本的色彩，默认为蓝色； background：设置网页的背景图像； leftmargin：设置页面左边的空白边距，单位是像素； topmargin：设置页面上方的空白边距，单位是像素。 3. HTML常用标记常用标记文本格式文本格式1. 字体标记字体标记v 和和：该

25、标记可用来设置文本的字体、字号和文本颜色该标记可用来设置文本的字体、字号和文本颜色等，是等，是HTML文档中常用的标记。文档中常用的标记。v 其设置格式为：其设置格式为： 文字文字 size: 用于设定字号，即文字的大小，“size”属性的有效值范围为17，默认值为3。在size属性值之前可以加上“+”和“-”符号，用于指定相对于默认字号值的增量或减量。 face: 用于设定字体名称，例如英文字体的“Times New Roman”、“Arial”；中文字体的“宋体”、“黑体”、“华文彩云”； color: 设定文字颜色，如前所述，各种颜色值可以使用英文颜色名称表示，也可以使用十六进制值表示。

26、3. HTML常用标记常用标记文本格式文本格式例例1“字体字体”设置设置编写代码制作如下网页文本效果。编写代码制作如下网页文本效果。 代码如下：代码如下： 字体设置字体设置 1号字体号字体 2号字体号字体 3号字色红体号字色红体 4号蓝色字体号蓝色字体 5号橙色字体号橙色字体 6号黄色黑体字体号黄色黑体字体 7号绿色隶书字体号绿色隶书字体 +2号紫色宋体字体号紫色宋体字体 3. HTML常用标记常用标记文本格式文本格式2文字修饰标记文字修饰标记 v HTML文档允许在要显示的文字两端添加各种文字修饰标记，这些标文档允许在要显示的文字两端添加各种文字修饰标记，这些标记及其功能描述如下表记及其功能

27、描述如下表 ：3. HTML常用标记常用标记文本格式文本格式例例2文字修饰标记文字修饰标记制作如图制作如图2-5所示的多格式网页文本所示的多格式网页文本效果效果 。 代码如下：代码如下： 文字修饰标记文字修饰标记 粗体字粗体字 斜体字斜体字 加下划线加下划线 下标字效果下标字效果 带删除线字体带删除线字体 字体强调效果字体强调效果 3. HTML常用标记常用标记文本格式文本格式2特殊字符标记特殊字符标记 v 空格、字符空格、字符“”、“”、“&”等具有特殊意义，等具有特殊意义，要在网页中显示该些字符也同样要用专门的字符串表示要在网页中显示该些字符也同样要用专门的字符串表示 。v 该类字符串标记

28、都必须以该类字符串标记都必须以“&”开头，以开头，以“;”结束。结束。3. HTML常用标记常用标记段落格式段落格式1标题标记标题标记 ：正文的第一级标题标记。 第二、三、四、五、六级标题标记，分别为、和。 标题级别越高，文字越小。 设置为标题的文字将独占一行。 可以使用align属性指定标题文字的对齐方式，属性值有“left”，“right”和“center”，分别表示左对齐、右对齐和居中对齐，默认值为“left”。 3. HTML常用标记常用标记段落格式段落格式例例3 “标题标题”设置示例设置示例将各级标题的文本加入到网页将各级标题的文本加入到网页中，并设置其中四、五、六级标题的对齐方式分

29、别为：左中，并设置其中四、五、六级标题的对齐方式分别为：左对齐、居中对齐和右对齐。对齐、居中对齐和右对齐。 标题设置标题设置 H1: 一级标题一级标题 H2: 二级标题二级标题 H3: 三级标题三级标题 H4: 四级标题四级标题,左对齐左对齐 H5: 五级标题五级标题,居中对齐居中对齐 H6: 六级标题六级标题,右对齐右对齐 3. HTML常用标记常用标记段落格式段落格式2. 分段标记分段标记v ：段落标记。它的作用是将其内的文字另：段落标记。它的作用是将其内的文字另起一段显示。起一段显示。通常可以省略。通常可以省略。v 段与段之间有一个空行。段与段之间有一个空行。v 可以使用可以使用alig

30、n属性指定段落的对齐方式，使用方法同属性指定段落的对齐方式，使用方法同上。上。 3换行标记换行标记 v ：是换行标记。表示以后的内容移到下一行。：是换行标记。表示以后的内容移到下一行。v 它是单标记，没有它是单标记，没有。 3. HTML常用标记常用标记段落格式段落格式4. 水平线标记水平线标记 v 标记是一条水平线，是单标记。标记是一条水平线，是单标记。v 可以使用可以使用“align”属性设置对齐方式；属性设置对齐方式；“color”属性设属性设置水平线颜色；置水平线颜色；“size”属性设置水平线粗细，以像素为属性设置水平线粗细，以像素为单位，默认值为单位，默认值为2。v 使用使用“wi

31、dth”属性可设置线段长度，可以是以像素为单属性可设置线段长度，可以是以像素为单位的绝对值，也可以一个百分比的相对值，如位的绝对值，也可以一个百分比的相对值，如“width=50%”表示相对于当前窗口表示相对于当前窗口50%的宽度。的宽度。 3. HTML常用标记常用标记段落格式段落格式例例4 分段、换行及水平线标记分段、换行及水平线标记 。 早发白帝城早发白帝城 早发白帝城早发白帝城 作者：李白作者：李白 朝辞白帝彩云间，朝辞白帝彩云间， 千里江陵一日还。千里江陵一日还。 两岸猿声啼不住，两岸猿声啼不住， 轻舟已过万重山。轻舟已过万重山。 代码如下：代码如下：4. HTML常用标记常用标记列

32、表列表有序列表的结构如下所示：有序列表的结构如下所示： 第一项 第二项 第三项 3. HTML常用标记常用标记列表列表v 是无序列表标记，其中的列表项用是无序列表标记，其中的列表项用标记引导文字，显示网页中的这些文字标记引导文字，显示网页中的这些文字后，文字前会自动加上后，文字前会自动加上“ ”序号。序号。 无序列表的结构如下所示： 第一项 第二项 第三项 v 有序列表和无序列表的有序列表和无序列表的标记可省。标记可省。v 有序列表和无序列表都允许自身嵌套或相互嵌套有序列表和无序列表都允许自身嵌套或相互嵌套 。3. HTML常用标记常用标记列表列表v 例：例： 将该例中的将该例中的“”改为改为

33、“”，则为无序列表则为无序列表 3. HTML常用标记常用标记列表列表v 嵌套列表示例嵌套列表示例 ：实现代码：实现代码： 有序列表与无序列表有序列表与无序列表   以下是一个有序列表，有以下是一个有序列表，有4个列表项，其中第个列表项，其中第3项嵌入一个无序列表，也有项嵌入一个无序列表，也有4个列表项。个列表项。 网页多媒体的插入网页多媒体的插入 文本的插入文本的插入 图片的插入图片的插入 视频及动画的插入视频及动画的插入 mp4视频格式视频格式 rm视频格式视频格式 gif动画格式动画格式 flash动画格式动画格式 音频的插入音频的插入 3. HTML常用标记常用标记

34、图像图像图像标记图像标记 格式为：格式为： src属性是图像标记的必需属性，用来指定图像源文件的路径和文件名。网页使用的图片格式可以是GIF或JPEG。height和width的属性值为整数数值时，单位为像素，属性值以百分比表示（1%100%）时，图片将以相对当前窗口大小的百分比来显示。3. HTML常用标记常用标记图像图像align属性有left、right、top、middle和bottom共5种。其中“top”设置图像的顶部与文本顶部对齐； “middle”设置图像在垂直方向的中部与文本中部对齐； “bottom”设置图像的底部与文本的底部对齐。hspace属性用来指定图像与浏览器窗口左

35、边界的水平距离；vspace属性用来指定图像与窗口上端边界的垂直距离，单位是像素。alt属性用来指定图像的替换文字，当图像正在下载或下属性用来指定图像的替换文字，当图像正在下载或下载未成功时，图像所处的位置即可出现指定的替换文载未成功时，图像所处的位置即可出现指定的替换文字字。标记没有对应的结束标记标记没有对应的结束标记。3. HTML常用标记常用标记图像图像例：图片的插入例：图片的插入如左图所示在网页中插入一蒲公英花地的图片，当在硬盘上删除了该图片文件“picture.JPG”后，网页打开的效果如右图所示。 3. HTML常用标记常用标记表格表格1表格标记表格标记，一个，一个标记对定义设置一

36、个表格。标记对定义设置一个表格。标记有如下属性：标记有如下属性：uborder：定义表格边框的粗细，单位为像素，如果省略则：定义表格边框的粗细，单位为像素，如果省略则不带边框；不带边框；uwidth：定义表格的宽度，属性值为像素数或百分数（相：定义表格的宽度，属性值为像素数或百分数（相对窗口百分比）；对窗口百分比）；uheight：定义表格的高度，属性值为像素数或百分数（相：定义表格的高度，属性值为像素数或百分数（相对窗口百分比）；对窗口百分比）；ucellspacing：定义表项间隙，单位为像素；：定义表项间隙，单位为像素；ucellpadding：定义表项内部空白，单位为像素。：定义表项内

37、部空白，单位为像素。 3. HTML常用标记常用标记表格表格表格行标记表格行标记，一个，一个标记对定义表格的一个行。标记对定义表格的一个行。 表项标记表项标记，一个，一个标记对定义一个单元格，单元格内标记对定义一个单元格，单元格内容写在该标记对之间。容写在该标记对之间。 在在、和和标记可使用以下属性改变整个标记可使用以下属性改变整个表格或个别行、个别单元格的背景和边框的色彩。表格或个别行、个别单元格的背景和边框的色彩。ubgcolor：设置背景色彩；设置背景色彩；ubackground：设置背景图像；：设置背景图像；ubordercolor：边框的色彩。：边框的色彩。 3. HTML常用标记常用标记表格表格例：表格插入例：表格插入,在网页中插入一在网页中插入一3行行2列的表格列的表格实现代码：实现代码： 表格的插入