HTML语言与文本编辑.ppt

第3章 HTML语言与文本编辑,第3章 HTML语言与文本编辑,从本章开始将用3章的篇幅来讲解浏览器端的网页开发技术。尽管ASP.NET是服务器端技术，但是作为一个完整的网站常常离不开前端的浏览器，只有将网页开发技术与后台技术有机地结合才能构建出功能强大的网站。另外，ASP.NET 2.0也提供了网页开发的环境，在这个环境中我们完全能够开发出生动、美观的网页来。本章将首先讲解开发网页的两个最基础的知识：HTML语言和文本编辑。具体内容 包括：HTML语言HTML文本编辑超链接创建移动的文本HTML与XML比较综合示例,第3章 HTML语言与文本编辑,3.1 HTML语言 3.2 HTML文本编辑 3.3 超 链 接 3.4 创建移动的文本 3.5 HTML与XML的比较 3.6 综 合 示 例 3.7 小 结 3.8 习 题,3.1 HTML语言,3.1.1 HTML语言概述 3.1.2 HTML标记的基础 3.1.3 HTML文档的基本结构 3.1.4 HTML文档的编辑工具,3.1.1 HTML语言概述,HTML是Hyper Text Markup Language(超文本标记语言)的缩写。它是WWW(World Wide Web)中使用的超文本标记语言。它是Tim Berners-Lee 在 CERN(在日内瓦的欧洲粒子物理实验室)发明的。它最早源于SGML(Standard Generalized Markup Language，标准通用标记语言)语言，它是在SGML定义下的一个描述性语言，或者可以说HTML是SGML的一个应用程序。HTML语言的重要性在于，它是所有浏览器都能识别的通用语言，是浏览器生成网页的基础。利用它可以完成以下三方面的工作：定义在浏览器上的显示格式；建立超链接；集成其他多媒体软件。HTML语言的特点是：第一，HTML不是程序语言，它只是一种标记语言，一种文本语言。它不同于我们平时所看到的VB、C+这类编程语言，实际上它只是在一些对象(如文本、图片、表格等)中加入各种各样的标记，从而使这些对象以这些标记所定义的形式显示出来。第二，任何文本编辑器都可以编辑它，只要能将文件另存成ASCII纯文本格式即可。一个HTML文件是一页文字信息，就像一封电子邮件或一个Word字处理文件，而且实际上完全可以使用Word字处理软件来编写一个HTML网页。也可以通过其他字处理软件编写文本文件，当然使用专业的网页编辑软件更为方便一些。,第三，需要使用Web浏览器。当你想把网页制作成某种模样时，需要使用一种编码通过浏览器进行解释，这种编码就被称为HTML代码。所有网页，都是通过浏览器对HTML的解释而形成的，浏览器就相当于HTML语言的翻译程序，负责解释HTML文件各种符号的含义。一个HTML文件中包含了所有将显示在网页上的文字信息，其中也包括对浏览器的一些指示，如哪些文字应放置在何处，使用哪种显示模式等。如果还有一些图片、动画、声音或是任何其他形式的资源，HTML文件也会告诉浏览器到哪里去查找这些资源，以及这些资源将放置在网页的什么位置。第四，HTML语言独立于各种平台。自1990年以来HTML就一直被用作World Wide Web(WWW)的信息表示语言，用于描述网页的格式设计和它与WWW上其他网页的连接信息。HTML语言目前已经成为各种类型浏览器的通用标准，它能独立于各种操作系统平台(如UNIX，Windows等)。其内容从功能上大体可分为：文本结构设置、列表建立、文本属性制定、超链接、图片和多媒体插入、对象、表格以及窗体的操作等。,3.1.2 HTML标记的基础,HTML语法格式非常简单，基本上只要明白了各种标记的用法便算学懂了HTML，也就是说它只是在一些对象(如文本、图片、表格等)中加入各种各样的标记，从而使这些对象以这些标记所定义的形式显示出来。这里我们先了解基本的HTML语法等内容。1基本的HTML语法(1)所有的标记都必须用尖括号(即小于号“”)括起来。它以开始标记及结束标记将对象围住。(2)大部分标记是成对出现的，包括开始标记和结束标记。开始标记和相应的结束标记定义了标记所影响的范围。结束标记与开始标记名称相同，但结束标记必须用一个斜线符号开头。(3)所有被标记包围的对象，如文本、图像、表格等都按照标记定义的格式显示。例如：欢迎参观本网页！中间的字符串按照号字体的大小显示。(4)有少数标记允许只有开始标记没有结束标记。例如：断行用的标记：分段用的标记：(5)标记不区分大小写，但默认情况下，ASP.NET 2.0中系统提供的HTML标记都用小写字母表示。,3.1.2 HTML标记的基础,2标记的属性大多数标记都拥有一些属性，大部分属性都有默认值，利用这些属性可以对标记的作用进行更多的控制。设置或改变属性时，将属性名=值放在标记名的同一个尖括号中，而且所有属性都放置在开始标记的尖括号内。例如：本段落将放置在右端 其中p是段落标记，align代表“对齐方式”，是属性名。right代表“右边”，是属性的值。这个标记的含义是将字符串放在浏览器的右端。其中hr是水平线标记，size是水平线的高度，width是水平线的宽度，align为对齐属性。此行代码表示增加一条横线，水平线的高度为6，宽度为160，显示于浏览器的中间。,3.1.2 HTML标记的基础,3注释语句与其他程序设计语言一样，在HTML文本的适当位置上增加注释语句能提高文本的可读性，编译器将不解读注释部分，即注释不在浏览器窗口中显示出来。注释语句的格式是：这里不妨将它看作一种特殊的标志。例如：,3.1.3 HTML文档的基本结构,一个基本的HTML文档通常包含以下三对顶级标记。1.HTML标记：.HTML标记是全部文档内容的容器，是开始标记，是结束标记，它们分别是网页的第一个标记和最后一个标记，其他所有HTML代码都位于这两个标记之间。HTML标记告诉浏览器或其他程序：这是一个网页文档，应该按照HTML语言规则对标记进行解释。.标记是可选的，但最好不要省略这两个标记，以保持Web文档结构的完整性。2.首部标记：.首部标记用于提供与网页有关的各种信息。在首部标记中，可以使用和标记来指定网页的标题，使用和标记来定义CSS样式表，使用和标记来插入脚本，等等。,3.1.3 HTML文档的基本结构,3.正文标记：.正文标记包含了文档的内容，文字、图像、动画、超链接以及其他HTML对象均位于该标记中。正文标记有下列属性。BACKGROUD：指定文档背景图像的URL地址，图像平铺在页背景上。BGCOLOR：指定文档的背景颜色。TEXT：指定文档中文本的颜色。LINK：指定文档中链接的颜色。关于链接的介绍请参阅后面章节。VLINK：指定文档中已被访问过的链接的颜色。ALINK：指定文档中正被选中的链接的颜色。ONLOAD：指定文档首次加载时调用的事件处理程序。ONUNLOAD：用于指定文档卸载时调用的事件处理程序。在上述属性中，各个颜色属性的值有两种表示方法：使用颜色名称来指定，例如红色、绿色和蓝色分别用red、green和blue表示；使用十六进制格式数值#RRGGBB来表示，RR、GG和BB分别表示颜色中的红、绿、蓝三基色的两位十六进制数据。,3.1.3 HTML文档的基本结构,4.HTML文档的基本结构学习了文档的几个标记后，现在需要按照一定的规则组织它们才能使用。这个规则就是HTML文档的基本结构。学会它可从整体上把握HTML文档的使用。HTML文档的基本结构可以表示如下：标题文字文本、图像、动画、HTML指令等HTML文档是一种树形(层次)结构。标记是文档的根，其他的HTML标记全部包括在以内。下面有两大分支：和。其中分支为文档的主体，主体中的内容将显示在客户端的浏览器中。内又包括若干分支：如用H1、H2等表示字体字号，P、DIV、FORM等表示块元素，等等。而在段中除 包括的内容将作为窗口的标题显示在最上方外，其余部分主要是关于文档的说明以及某些共用的脚本程序。与为独立的两个部分，不能互相嵌套。,3.1.4 HTML文档的编辑工具,1.HTML文档编辑器的选择虽然任何一种文本编辑器都可以作为HTML编辑器。如Windows的记事本等。但为了减少网页设计的工作量，开发商设计了许多专用的网页编辑器，像Dreamweaver、FrontPage等，提供了可视化设计网页的工具，设计者可用“所见即所得”的直观方法来创建网页，系统再自动将其转化成HTML语句，然后传送到浏览器，从而简化了设计的过程。本书的例题均在ASP.NET 2.0的【设计】或【源】视图中进行。,3.1.4 HTML文档的编辑工具,2.文档编辑的基本步骤首先创建网站，然后右击网站名，在弹出的快捷菜单中选择【添加新项】，在弹出的对话框中选择【HTML页】，在左下方给网页更名，然后单击【添加】按钮。新打开的网页左下角将出现【设计】和【源】两个标签，在设计视图中可以进行可视化设计，在【源】视图中可以直接编写HTML代码。两个视图是等效的，可以随时切换，相互补充。图3.1的中间部分是刚建立HTML网页时【源】视图窗口的情况；左边工具箱是在【设计】视图中进行可视化设计时可以使用的控件；右边是控件的属性窗口。有时，一些网页中需要多次使用的标记，在工具箱中找不到相应的图标时，可以先在【源】视图窗口中，写出该标记的代码，然后将这些代码直接拖到工具箱中，以后就可以直接利用工具箱进行可视化操作了。,3.1.4 HTML文档的编辑工具,图3.1 刚打开的HTML网页的代码界面,3.2 HTML文本编辑,3.2.1 HTML文本的格式化 3.2.2 设置列表文本,3.2 HTML文本编辑,现在着重介绍HTML的文本对象的编辑，掌握了这部分内容就不难学会其他对象的编辑。在这里虽然也要用到可视化方法，但是建议用输入HTML代码的方法试做一下。为了达到练习和巩固HTML语言的目的，文中有些地方有意不给出其可视化方法，待熟练后，再用可视化方法练习一遍。,3.2.1 HTML文本的格式化,1字符的格式化(1)设置字体、字号和颜色在HTML语言中，可以使用字体标记来设置文本的字符格式，为此可以将文本置于和标记之间，并通过FAC、SIZE和COLOR属性来设置文本的字体、字号和颜色。FACE属性指定一种字体，或者给出一个字体列表，各种字体名称用逗号来分隔，可以按照作者的喜好程度来排列。例如：龙卷风SIZE属性指定字体的大小(即字号)，其取值可以从1到7，默认值为3。SIZE属性值越大，显示的字号就越大。相对于基本字体(BASEFONT)的大小，也可使用+或-来指定相对字号。如：龙卷风静态网页设计COLOR属性指定文本的颜色，可以用颜色名称表示，也可以用十六进制RGB格式表示。例如：龙卷风静态网页设计,3.2.1 HTML文本的格式化,(2)设置字符样式和特殊字符设置字符样式通过设置字符样式可以为某些字符设置特殊格式，例如粗体、斜体、下划线、删除线、上标、下标等。常用的设置字符样式的标记如下：.粗体.大字体.斜体.删除线.小字体.删除线.上标.下标.固定宽度字体.下划线插入特殊字符设计网页时，经常要插入一些空格。这本来是一个十分简单的问题，但在HTML网页中却变得比较麻烦。在输入文本时按了多次空格键，但在浏览器中打开网页时却只能看到一个空格。另外，在网页中有时可能要插入一些特殊符号，如版权符号和注册符号等。当遇到这种情况时，可以使用两种方式来输入特殊符号：使用字符实体名称或数字表示方式。前者为“”，等等。表3.1列出了一小部分特殊符号的实体名称和数字表示，其他可参考帮助文档。,空格是 HTML 中最普通的字符实体。通常情况下，HTML 会裁掉文档中的空格。假如你在文档中连续输入 10 个空格，那么 HTML 会去掉其中的9个。如果使用 使用实体名称而不是实体编号的好处在于，名称相对来说更容易记忆。而这么做的坏处是，并不是所有的浏览器都支持最新的实体名称，然而几乎所有的浏览器对实体编号的支持都很好。注意：实体对大小写敏感。,3.2.1 HTML文本的格式化,3.2.1 HTML文本的格式化,2段落的格式化段落是文档的基本信息单位，一个字符也可能是一个段。将文档划分为段落，可以通过使用分段标记、换行标记、标题标记或插入水平线的手段来实现。(1)设置分段标记P分段标记定义了一个段落，使用该标记时要跳过一个空行，使后续内容隔一行显示。若同时使用和，则将段落包围起来，表示一个分段的块。若省略结束标记，可以将开始标记放在段尾。分段标记的常用属性是ALIGN，用于设置段落的水平对齐方式。(2)设置换行标记BR标记强行规定了当前行的中断，使后续内容在下一行显示。(3)设置标题标记Hn标题标记用于设置文档中的标题和副标题，其中n的取值是1到6，如：.标记表示字号最大的标题，标记表示字号最小的标题。(4)设置水平线标记HRHR标记在文档中添加一条水平线，用来分开文档的两个部分。该标记有以下属性：ALIGN：指定线的对齐方式，取值为left(左对齐)、center(居中对齐)或right(右对齐)，默认值为center。COLOR：指定线的颜色。NOSHADE：若指定该项，则显示一条无阴影的实线。SIZE：指定线的宽度，以像素为单位。WIDTH：指定线的长度，单位可以是像素或百分比(占页面宽度的百分比)。,3.2.1 HTML文本的格式化,(5)设置段落的对齐方式在网页中有四种段落对齐方式：左对齐、右对齐、居中对齐和两端对齐。在HTML语言中，可以使用ALIGN属性来设置段落的对齐方式。ALIGN属性可以应用于多种标记，例如分段标记.、标题标记.以及水平线标记等。ALIGN属性的取值可以是：left(左对齐)、center(居中对齐)、right(右对齐)以及justify(两端对齐)。两端对齐是指将一行中的文本在排满的情况下向左右两页边对齐，以避免在左右页边出现锯齿状。对于不同的标记，ALIGN属性的默认值是有所不同的。对于分段标记和各个标题标记，ALIGN属性的默认值为left；对于水平线标记，ALIGN属性的默认值为center。若要将文档中的多个段落设置成相同的对齐方式，可将这些段落置于和标记之间组成一个节，并使用ALIGN属性来设置该节的对齐方式。如果要将部分文档内容设置为居中对齐，也可以将这部分内容置于和标记 之间。,3.2.1 HTML文本的格式化,(6)示例 HTML文本的基本格式化练习 静 思 床前明月光，疑是地上霜，举头望明月，低头思故乡。,3.2.2 设置列表文本,1创建有序列表有序列表：是在各列表项前面显示数字或字母的缩排列表，可以使用有序列表标记OL和列表项标记LI来创建，语法格式如下：列表项1列表项2列表项nOL标记有两个常用属性：START和TYPE。START属性用于数字序列的起始值，可以取整数值。TYPE属性用于设置数字序列样式，其取值可以是：1：表示阿拉伯数字1、2、3等，此为默认值。A：表示大写字母A、B、C等。a：表示小写字母a、b、c等。I：表示大写罗马数字I、II、III、IV等。i：表示小写罗马数字i、ii、iii、iv等。当位于和标记之间时，LI标记有两个常用属性：TYPE和VALUE。TYPE属性指定数字样式，其取值与OL的TYPE属性相同；VALUE属性指定一个新的数字序列起始值，以获得非连续性的数字序列。,3.2.2 设置列表文本,2创建无序列表无序列表是一种在各列表项前面显示特殊项目符号的缩排列表，可以使用无序列表标记UL和列表项标记LI来创建，语法格式如下：列表项1列表项2列表项nUL标记的TYPE属性用于指定列表项前面显示的项目符号，其取值可以是：disc：使用实心圆作为项目符号(默认值)。circle：使用空心圆作为项目符号。square：使用方块作为项目符号。应注意在IE浏览器中，TYPE属性的值是区分大小写的。,3.2.2 设置列表文本,3示例无序和有序列表练习：星期一课程安排表。无序和有序列表的练习 星期一课程安排表:第一节:计算机导论第二节:Web应用程序第三节:数据库理论第四节:C#及Windows设计第五节:英语第六节:数学第七节:政治,3.3 超 链 接,1超级链接的概念(1)超链接的含义“超链接”是HTML语言的精华。通过超链接你可以随时转向其他页面或者到某个段落去查看你想要看的东西，还可以跨越站点，到其他站点上去查阅相关信息。你可以浏览世界各地的最新信息。而这一切只需坐在屏幕前点一点鼠标就能实现。超链接是由源端点到目标端点的一种跳转。源端点可以是网页中的一段文本或一幅图像等。目标端点可以是任意类型的网络资源，例如一个网页、一幅图像、一首歌曲、一段动画或一个程序等。(2)超链接的形式按照目标端点的不同，可以将超链接分为以下几种常见形式。文件超链接：这种链接的目标端点是一个文件，当然包括各种文件，如页面文件，它可以位于当前网页所在的服务器上，此时可称为“站点内页面的链接”，也可以位于其他服务器，此时可称为“与站点外页面的链接”。锚点超链接：这种链接的目标端点是网页中的一个位置，通过这种链接可以从当前网页跳转到本页面或其他页面中的指定位置。E-mail链接：通过这种链接可以启动电子邮件客户端程序(如Outlook或FoxMail等)，并允许访问者向指定的地址发送邮件。图像超链接：这种链接是在图像上建立若干个区域称为“链接区”，通过它可以跳转到其他目标端点去。(3)关于路径路径是指从站点根文件夹或当前文件夹到目标文件所经过的路线，可以使用路径来指定超链接中目标端点的位置。路径有以下几种类型：绝对路径：也称为绝对URL，它给出目标文件的完整URL地址，包括传输协议在内。如果要链接的文件位于外部服务器上，则必须使用绝对路径。相对路径：也称为相对URL，是指以当前文档所在位置为起点到目标文档所经过的路径。若要将当前文档与处在同一文件夹中的另一个文档链接，或者将同一站点中不同文件夹下的文档相互链接，都可以使用相对路径，此时可以省去当前文档与目标文档完整URL中的相同部分，只留下不同部分。根相对路径：是指从站点根目录到被链接文件的路径。使用这种路径是指定站点内文档链接的最好方式。,3.3 超 链 接,2常见链接的创建(1)创建文件链接在HTML语言中，可以使用A标记来创建超链接，基本语法格式如下：文本上述语法格式包含A标记的以下基本属性：HREF：该属性是必选项，用于指定目标端点的URL地址，可以包含一个或多个参数。具体地，如果是与站点以外页面链接的情况，就为URL；如果是与站点内页面链接，则为文件名。TARGET：该属性是可选项，用于指定一个窗口或框架的名称，目标文档将在该窗口或框架中打开。如果省略该属性，则目标文档将取代包含该超链接的文档。TARGET属性的取值既可以是窗口或框架的名称，也可以用“_blank”指定将链接的目标文件加载到未命名的新浏览器窗口中；用“_parent”指定将链接的目标文件加载到包含链接的父框架页或窗口中，如果包含链接的框架不是嵌套的，则链接的目标文件加载到整个浏览器窗口中；用“_self”指定将链接的目标文件加载到链接所在的同一框架或窗口中，这是默认值；用“_top”指定将链接的目标文件加载到整个浏览器窗口中，并由此删除所有框架。TITLE：该属性也是可选项，用于指定指向超链接时所显示的标题文字。,3.3 超 链 接,(2)创建锚点链接创建锚点链接时，要在页面的某处设置一个位置标记(即所谓锚点)，并给该位置指定一个名称，以便在同一页面或其他页面中引用。通过创建锚点链接，可以使超链接指向当前页面或其他页面中的指定位置。若要创建锚点链接，首先在页面中为需要跳转的位置命名，即在该位置上放置一个A标记并通过NAME属性为该位置指定一个名称，一般不要在和标记之间放置任何文字。例如，可以使用A标记在test.htm页面顶部创建一个锚点：创建锚点后，可以使用A标记来创建指向该锚点的超链接。例如，要在同一个页面中跳转到名为“top”的锚点处，可以使用以下HTML代码：返回顶部 若要在其他页面中跳转到该锚点，则使用以下HTML代码：跳转到test.htm页的顶部,3.3 超 链 接,(3)创建邮件链接使用A标记创建邮件链接，该标记的HREF属性应由三个部分组成：第一部分是电子邮件协议名称mailto，第二部分是电子邮件地址，第三部分是可选的邮件主题，其形式为“subject=主题”。第一部分与第二部分之间用冒号(:)分隔，第二部分与第三部分之间用问号(?)分隔。例如：给我写信当访问者在浏览器窗口中单击邮件链接时，将会自动启动电子邮件客户端程序(例如Outlook Express或FoxMail等)，并将指定的主题填入“主题”栏中。(4)创建图像超链接图像的超链接与文本超链接差不多，就是将标记放在图片两端即可。例如语句：当单击dysb.jpg图片时将转向Default.htm网页。具体如何使用等标记的内容请参阅4.2节。,3.3 超 链 接,3示例超链接主要形式的示例(注：下面的“”代表热点，即一般用鼠标指向时，鼠标指针变手形的区域)。(1)创建指向本地页面的链接(链接到本地磁盘上同一目录下的页面)(链接到本地磁盘上不同目录下的页面)(2)创建指向其他服务器的页面链接(链接到Internet上其他服务器上的页面)(3)创建一个指向页面特定部分的链接(链接到本页面内的某指定位置)(链接到其他服务器上页面的某指定位置)(4)创建一个指向电子邮件的链接,3.4 创建移动的文本,在网页中经常可以看到一些移动的字符串。我们有时称这些移动的字符串为“移动字幕”或“跑马灯”，它可以进一步吸引人们的注意力。这些移动的字符串是如何形成的呢？利用MARQUEE标记可以将静态的文本转换为动态文本。该标记使用的语法如下：要滚动显示的文本信息标记有很多属性可以改变移动的方式。例如：ALIGN：指定字幕与周围文本的对齐方式，其取值可以是top、middle或bottom。BEHAVIOR：指定文本动画的类型，其取值可以是scroll、slide或alternate。BGCOLOR：指定字幕的背景颜色。DIRECTION：指定文本的移动方向，其取值可以是down、left、right或up。HEIGHT：指定字幕的高度，以像素或百分比为单位。HSPACE：整数，指定字幕的外部边缘与浏览器窗口之间的左右边距(像素)。LOOP：指定字幕的滚动次数。SCROLLAMOUNT：整数，指定字幕文本每次移动的距离，以像素为单位。SCROLLDELAY：整数，指定与前段字幕文本延迟多少ms后重新开始移动 文本。VSPACE：整数，指定字幕的外边缘与浏览器窗口之间的上下边距(像素)。,3.4 创建移动的文本,下面举例说明这些属性的使用方法。例 1：我们在移动字符串的前后加上标志，如下所示：移动字符串 当进入浏览器时，“移动字符串”这五个字将从右向左移动，到达左边沿时再快速返回到右边，继续向左移动，不断循环直到关闭该网页时为止。根据需要也可设置成向不同方向移动。注意：这里虽然没有明显地用direction设置移动方向，但是一般每个属性都会有一个默认值，如果没有设置该属性值，就采用默认值，而direction的默认值为left，即从右向左移动。如果想设置为从左向右移动，就要写上direction=right。例2：再见了！用于控制移动范围。例3：滑到终点了！控制移动到左端就停止移动。例4：撞来撞去，啊！我昏啦从右到左，再从左到右反复进行。例 5：哗！太快了，我又昏啦用来控制移动速度和移动的次数。,3.5 HTML与XML的比较,到此为止，我们已经介绍了两种标记语言：XML与HTML。它们都派生于SGML，都是用标记来定义它们的特性，从外观上看非常相似。但两者之间却有着本质的区别。这些区别是：HTML用来定义显示，而XML是对语义的描述。HTML的标记由系统定义，而XML的标记自行定义。HTML的语法比较松散，而XML的语法比较严格(例如，区分大小写，各标记必须封闭等等)，因此XML的执行效率要高一些。为了显示XML文本，常需要与其他文件结合起来使用。当前这两种标记语言都被广泛地应用于网络应用之中。HTML用来定义浏览器的显示，XML用来在不同平台之间传输和交换数据。为了正确显示XML文本的内容，需要和其他文件结合，有时也需要和HTML语言相结合。现在ASP.NET 2.0中使用XHTML语言，它将HTML语言纳入XML语言的规则中。既然XML语言的标记可以任意定义，HTML的标记当然也可以成为其中的一部分。XHTML与HTML相比只是语法规则严格了一些。这就是说，在ASP.NET 2.0中编写XHTML代码时，标记将区分大小写，各个标记必须是封闭的。例如，断行标记也应该写成或的形式。因此用XHTML语言写出的代码执行效率也将更高一些。除此以外没有其他变化。,3.6 综 合 示 例,下面是一个简单HTML文本示例，其中，“文具；照相；体育；音响；空调；彩电等”字符串从左向右不断循环移动，单击“东风商场”可打开电子邮件客户端程序。请分别用手工代码法和可视化方法练习。(1)浏览器显示的界面如图3.2所示。(2)给出参考的HTML代码：Untitled Document 简要情况 本商场一贯讲究信誉，能为客户提供多种满意的商品，计有：文具；照相；体育；音响；空调；彩电等 本商场保证做到：质量优秀 价格合理 服务热情 如有意见或建议请发电子邮件寄东风商场,3.6 综 合 示 例,图3.2 综合示例的网页界面,3.7 小 结,一个好的网页中常常包含各种不同的文本，这些文本的大小不同，形式也不相同，是什么方法使它们变得如此丰富多彩呢？是HTML语言(加上下一章将介绍的CSS)。在桌面系统中，利用文字编辑软件(例如Word)编辑文本时，将文本写成什么样将来就显示成什么样。但是浏览器与此不同，它只认识HTML语言。只有用标记才能定义显示的形式。为了显示不同的形式，系统确定了不同的HTML标记。使用时只需要用这些标记把定义的对象包围起来即可。由于使用方法非常简单，因此受到广泛的欢迎，HTML已经成为各种类型的浏览器的通用语言。标记中的属性如宽度、高度、颜色以及对齐方式等，作为标记定义的补充，大大增强了标记定义的表现力。文本或图像超链接是HTML语言的灵魂，正是因为有了它，才可以让人们在网上冲浪，遨游世界。在HTML语言中超链接定义的最简单的格式是：链接文本动态文本常常能够起到突出重点，吸引更多网民目光的效果。定义移动字符串的语 句是：移动的文本其实移动图片的定义语句与此相同。格式如下：移动的图片即在的标记中间放进一张或多张图片，这些图片即可以移动的方式显示。在标记中还可以增加很多属性，用来控制移动的方式(如向左、向右、往返等)和移动的速度。,3.8 习 题,1 填空题 2 选择题 3 判断题 4 简答题5 操作题,3.8 习 题_填空题,(1)HTML是_的英文缩写。它是WWW(英文为_)中使用的超文本标记语言。它是由_在CERN(在日内瓦的欧洲粒子物理实验室)发明的。它最早源于SGML(Standard Generalized Markup Language，标准通用标记语言)。(2)对于HTML语言，任何_编辑器都可以编辑它。它目前已经成为各种类型_的通用标准，它能独立于各种_平台。(3)所有网页，都是由_对HTML解释而形成的，_就相当于HTML语言的翻译程序，负责解释HTML文件各种符号的含义。(4)列表文本有_和_两种形式。,3.8 习 题_选择题,(1)在网站中，路径通常有_种表示方式，它们分别是_。A.3 绝对路径、根目录相对路径、文档目录相对路径B.2 绝对路径、根目录相对路径C.3 绝对路径、根目录绝对路径、文档目录相对路径D.2 绝对路径、根目录绝对路径(2)在HTML中，超链接由_标记定义。A.B.C.D.(3)下面关于绝对路径的说法，正确的是_。A.绝对路径是被链接文档的完整URL，不包括使用的传输协议B.使用绝对路径需要考虑源文件的位置C.在绝对路径中，如果目标文件被移动，则链接同样可用D.创建外部链接时，必须使用绝对路径(4)HTML代码 表示_。A.创建一个超链接B.创建一个自动发送电子邮件的链接C.创建一个位于文档内部的链接点D.创建一个指向位于文档内部的链接点,3.8 习 题_判断题,(1)HTML语言是对显示的描述，而XML语言不仅能描述显示还能描述语义。()(2)HTML语言与XML一样，它们的标记都是严格区分大小写的。(),3.8 习 题_ 简答题,(1)HTML页面的基本结构是怎样的?(2)在HTML页面中如何实现左对齐、右对齐和居中对齐？(3)如何在页面中插入锚点？说出好处。(4)是否可以在不同的页面间实现用锚点链接进行跳转？如果可以，怎样实现？(5)简述HTML与XML之间的区别。,3.8 习 题_ 操作题,在网站中创建多个.htm网页，要求在网页中实现以下技术：使用各种不同字体、颜色的文本；使用两种列表；超链接(文本超链接、锚点超链接、电子邮件超链接等)；结合移动字符串进行超链接。,Q&A?Thanks!,