静态网页设计和HTML语言.ppt

1、6.1 静态网页设计与HTML语言,6.1.1 静态页面的体系结构 静态网页的特征 静态网页的内容固定不变; 静态网页的制作比较方便； 静态网页的体系结构,6.1 静态网页设计与HTML语言,6.1.2标记语言Web环境下，采用标记来管理文本内容的现实和格式，常用的标记语言有：SGML:标准通用标记语言，元语言HTML:超文本标记语言，Web显示语言XML:扩展标记语言，定义数据结构，适合 数据传输,6.1 静态网页设计与HTML语言,6.1.3 标记语言家族,6.1 静态网页设计与HTML语言,6.1.4超文本置标语言HTML 特点 平台兼容 文本文件 Web服务器不处理标记，由客户端浏览器

2、解释 丰富的多媒体显示、各种布局处理 不足 HTML过多的考虑布局，缺乏对结构化数据的表示能力； 链路丢失后不能自动纠正、下载的内容太多、搜索不方便、时间长等缺点； HTML中有限的标记不能满足众多Web应用的需要 ，缺乏可扩展性,HTML第一讲：基础,6.1 静态网页设计与HTML语言,HTML文档的编写方法,手工直接编写 记事本等，存成.htm .html格式 使用可视化HTML编 辑 器 Frontpage、Dreamweaver等 由Web 服务器（ 或称HTTP 服务器） 一 方实时动态地生成。,6.1 静态网页设计与HTML语言,网页文件命名,*.htm或*.html 无空格 无特

3、殊符号（例如&符号），只可以有下划线“_”，只可以为英文、数字 区分大小写 首页文件名默认为：index.htm 或 index.html,HTML 文件结构,. . . 元素：是HTML语言的基本部分。元素总是成对出现，每一对元素一般都有一个开始的标记（如），也有一个结束的标记（如）。元素的标记要用一对尖括号括起来，并且结束的标记总是在开始的标记前加一个斜杠。,6.1 静态网页设计与HTML语言, HTML 文件的正文,头部,主体,HTML 文件结构,6.1 静态网页设计与HTML语言,第一张网页（01.htm）,my first pageThis is my first homepage!

4、,基本组成部分HTML元素属性,HTML元素可以有自己的相关属性，每一个属性还可以由我们网页编制者赋一定的值。元素属性出现在元素的内，并且和元素名之间有一个空格分隔；属性值用“”引起来。,第二张网页（02.htm）,my first page This is my second homepage!,居中,HTML元素及元素属性,HEAD之元素1 元素出现在文档的开头部分。与之间的内容不会在浏览器的文档窗口显示，但是其间的元素有特殊重要的意义。 元素定义HTML文档的标题。与之间的内容将显示在浏览器窗口的标题栏。,HTML元素及元素属性,HEAD元素 2 元素 元素下面可以插入很多很有用的元素属

5、性。下面介绍四种：用来标记搜索引擎在搜索你的页面时所取出的关键词。,HTML元素及元素属性,HEAD元素 3 元素 用来标记文档的作者。,HTML元素及元素属性,HEAD元素 4 元素 用来标记你的页面的解码方式。,HTML元素及元素属性,HEAD元素 5 元素 用来自动刷新网页,练习（03.htm）,编写一个网页，要求3秒钟后自动跳转到南京邮电大学的网站。my third page三秒钟后本网页将自动跳转到南京邮电大学首页,元素及元素属性1,元素表明是HTML文档的主体部分。在与之间，通常都会有很多其它元素；这些元素和元素属性构成HTML文档的主体部分。,元素及元素属性2,元素中有下列元素属

6、性： (1)bgcolor bgcolor属性标志HTML文档的背景颜色。如：改变HTML文件的背景颜色 例：04.htm,HTML对颜色的控制,HTML对颜色的控制也有自己的语法。HTML使用16进制的RGB颜色值对颜色进行控制。 16 进制的数码有: 0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f.,常见颜色的代码,元素及元素属性3,元素中有下列元素属性： (2)background background属性标志HTML文档的背景图片。如：。 可以使用的图片格式为GIF，JPG例：05.htm、06.htm,元素及元素属性4,元素中有下列元素属性： (3)bgpropert

7、ies=fixed bgproperties=fixed使背景图片成水印效果，即图片不随着滚动条的滚动而滚动。例：07.htm和08.htm对比,元素及元素属性5,元素中有下列元素属性： (4)text text属性标志HTML文档的正文文字颜色。如：text=“#FF6666”。Text元素定义的颜色将应用于整篇文档。 例：09.htm,元素及元素属性6,元素中有下列元素属性： (5)超级链接颜色 link、vlink、alink分别控制普通超级链接、访问过的超级链接、当前活动超级链接颜色。南京邮电大学 这是一个链接的例子。点一下带下划线的文字!链接到22.htm例：10.htm,元素及元素

8、属性7,元素中有下列元素属性： (6) leftmargin和topmargin 设置网页主体内容距离网页顶端和左端的距离如：例：11.htm,HTML第二讲：内容设置,文字标签属性1,文字属性标记 1.文字颜色 指定颜色 . #=RRGGBB 16 进制数码兰色字红色字绿色字 例：01.htm,HTML2内容设置,文字标签属性2,文字属性标记 2.文字字体. #=客户端可获得的字体黑体 楷书 宋体 02.htm,文字标签属性3,文字属性标记 3.文字大小. #=1, 2, 3, 4, 5, 6, 7 or +#, -# 专业铸造品质 知识成就未来例：03.htm,文字标签属性4,文字属性标记

9、 4.文字标题. #=1, 2, 3, 4, 5, 6 老崔的一无所有 例：04.htm,文字布局,行的控制 段(Paragraph) (可以看作是空行) 空白占位符很好 例：05.htm,文字布局,行的控制 HTML的段落与段落之间有一定的空隔。如果不希望出现空隔而只想换行的话，就要用到另一个元素，即元素。元素可以使所在的位置出现换行。这种换行和浏览器的自动换行的效果类似。元素不是成对出现的。例：BR标记的应用你好吗？很好 06.htm 不换行请改变您浏览器窗口的宽度， 使之小于这一行的宽度， 看看这个标记的作用！ 07.htm,HTML文字与段落格式控制,倾斜文本粗体文本下划线文本删除线文

10、本 例：08.htm、09.htm、10.htm、11.htm(综合练习),代数方程式 9X 2+2X +3=173X 1+2X 2=10,基本组成部分HTML注释,HTML文档可以插入注释。注释内容不会在浏览器窗口显示 HTML注释的格式为： 代数方程式 例：12.htm,文字的对齐,. (n=1,2,3,4,5,6) . (#=left, center, right)align标志的居中对齐p标志中利用align标志实现右对齐 center标志的居中对齐 例：13.htm,文字的分区显示, . (#=left, center, right) P标记自动空行，div不空行作为一名顶级吉他大师

11、，盖米摩尔是在用他的心在划弦，而绝不是用手指. 作为一名顶级吉他大师，盖米摩尔是在用他的心在划弦，而绝不是用手指. 例：14.htm,3.HTML段落与分行控制,居中- 元素 元素是一个独立的使所标记的字符居中的元素。它的作用与使用元素里的align=“center”类似 例如：居中段落 15.htm,3.HTML段落与分行控制,水平线：设定线宽：设定线长：设定对齐方式 #=left, right ：设定线的颜色例：16.htm,3月31号 复习,HTTP协议是基于什么范式的？ HTTP响应状态字4XX和5XX分别表示什么？ 网页按照内容来分通常分为哪三种？ 网页上通常包含哪些元素？表单和表格

12、的主要功能分别是什么？ HTML的特点和不足？（第四页） HTML头文件里通常包含哪些内容？ 如何在Dreamweaver中插入垂直分割线？,请求/响应,客户端/服务器端错误,主页、内容页和索引页,文本、声音、图像、动画和数字视频等,用户交互/网页布局,页面属性/CSS/脚本,3. HTML的段落与分行控制,无序列表元素1 列表在HTML的文档里有重要的地位,HTML规定了多种列表元素。列表所起的主要作用是使特定的文本有序化。,3. HTML的段落与分行控制,无序列表元素2 无序列表是由和元素定义的:无序列表列表项1列表项2有序列表列表项1列表项2例：17.htm,3. HTML的段落与分行控

13、制,无序列表元素3 无序列表的默认符号是圆点。 元素有type属性，通过定义不同的type属性可以改变列表的项目符号。目前，type属性的属性值有： disc(圆)、circle（圆圈）、square（方块）disccirclesquare例：18.htm,3. HTML的段落与分行控制,有序列表元素1 有序列表由和定义:sportsdrinkfriends例：17.htm,3. HTML的段落与分行控制,有序列表元素2 元素也有自己的type属性，type属性的属性值有1、A、a、I、i等。例如，我们以A、B、C作为列表的编号, ONE-ONE 例： 19.htm 元素还可以定义列表的起始编

14、号，如我们希望列表的第一个编号为5，而不是1，则需要定义元素的start属性ONE-ONE 例：20.htm,4.超级链接普通超级链接1,超级链接是整个WWW应用的核心和基础。如果没有超级链接的概念，那么，我们现在所有的WWW的应用将不复存在。所以，对超级链接的掌握具有特殊重要的意义。,4.超级链接普通超级链接2,超级链接是用锚元素定义的 在元素下，有元素属性href,href的属性值为一个URL地址 如：指向学院的超级链接 如：普通超级链接 例：21.htm,4.超级链接E-mail超级链接,超级链接可以指向E-mail地址 如：指向E-mail地址的超级链接例：22.htm,4.超级链接新

15、开链接窗口,开一个新的(浏览器)窗口 (Target Window) . 例：26.htm,4.超级链接去除下划线,去掉超级连接的下划线：style=“text-decoration: none”链接下面没有下划线例：25.htm,4.超级链接其他超级链接,WWW应用仅仅是Internet应用的一种,Internet还有其他很多应用，如：Ftp等。实际上mailto也属于非WWW应用。我们可以类似的创建指向Ftp等的超级链接; 指向其他Internet应用的超级链接不是我们掌握的重点。,4.超级链接锚点(书签) 1, 指向本页面锚点aa的超级链接 例：23.htm 指向23页面的锚点top的超

16、级链接 例：24.htm,练习：手写代码实现,链接（新开窗口与Email）、背景、文字颜色、字体、换行、页面标题。 练习：27.htm,南京邮电大学 新开窗口到南京邮电大学 给我来信 改变文字颜色 改变字体 ,HTML对图片的控制-1,基本语法:引用图片必须用元素标志。元素下的基本元素属性是src属性，src的属性值为所引用的图片的URL地址。 src属性是必须的。Src的URL可以是绝对地址，也可以是相对地址例：28.htm,HTML对图片的控制-2,所谓图片的替代文本，指图片不能显示时在图片所在位置显示的一段文本或当鼠标移到图片上时也会显示替代文本。 定义图片替代文本的方法是：例：28.h

17、tm,HTML对图片的控制-3,图片的显示大小 我们可以指定一幅图片在浏览器窗口里的显示大小。 定义图片的显示大小的方法是：width指定图片的宽度，height指定高度。它们的属性值可以是象素，也可以是%。 例：29.htm,HTML对图片的控制-4,图片的边框 我们可以为一幅图片加一个边框以突出显示：border的属性值为象素数例：30.htm,HTML对图片的控制-5,图片的对齐方式 图片可以相对于页面或单元格有一个对齐方式。 定义水平对齐方式的方法是：例：31.htm,HTML对图片的控制-6,图片的对齐方式 定义图片的垂直对齐方式：对于图片的对齐方式不仅是以上几种，但是以上的几种是最

18、常用的。 例：32.htm,HTML对图片的控制-7,定义图片与左、右的文本之间的间距 图片在显示时，与左右的文本之间可以有一定的间距Hspace(horizontal)定义水平间距； Vspace(vertical)定义垂直间距。单位都是象素数. 例：33.htm,HTML对图片的控制-8,图象的超级链接 图象的超级链接是指整个图象的超级链接，当点击图象的任何部分时，都会打开这个超级链接。定义默认超级链接的方法是：所以，所谓超级链接实际上就是用元素标志一个图象的引用; 例：34.htm,HTML对图片的控制-9,图象映射 所谓图象映射是指一个图片上的不同位置被指定了不同的超级链接；点击图片的

19、不同位置会打开不同的超级链接目标。这与前面的默认超级链把整个图片作为超级链接的元素是很不一样的。,HTML对图片的控制-10,图象映射（只要求理解标记含义） 图象映射由定义。有一个基本属性是name。Name给图象映射命名，这个命名将会被元素用usemap属性引用。所以，图象上的图象映射实际上是对定义的映射的一个引用。 在定义图象映射时，可以定义三种形状的映射： circle(圆形)、rect(矩形rectangle)、poly(多边形),HTML对图片的控制-11,图象映射实例（35.htm）,HTML第三讲：表格,单元格（用来表示，每个单元格可以有背景颜色和背景图片）,表格（用来表示，表格

20、可以有背景颜色、背景图片）,表格边框,每一行可以用来表示，单元格放在行中，每行可以有很多的单元格。,表头（用来表示，表头是特殊的单元格，其中的文字加进去之后默认是居中并且加粗）,HTML对表格的控制,表格(TABLE)标记-1, 元素：定义一个表格。每一个表格只有一对和，一张页面中可以有多个表格。 元素：定义表格的行，一个表格可以有多行，所以对于一个表格来说不是唯一的。 元素：定义表格的一个单元格。每行可以有不同数量的单元格，在和之间是单元格的具体内容。 需要注意的是：上述的三个元素必须、而且只能够配对使用。缺少任何一个元素，都无法定义出一个表格。,表格(TABLE)标记-2,表格的基本结构

21、定义表格定义表头定义表行 定义单元格例：02.htm,表格(TABLE)标记-3,表格的属性 1 width属性：指定表格或某一个表格单元格的宽度。单位可以是%或者象素。 height属性：指定表格或某一个表格单元格的高度。单位可以是%或者象素。 border属性：表格边线粗细 例03.htm、04.htm、05.htm,表格(TABLE)标记-2,表格的属性 1 4、bgcolor属性：指定表格或某一个单元格的背景颜色。 5、background属性：指定表格或某一个单元格的背景图片。其属性值为一个URL地址。 Food Drink Sweet 例：07.htm,表格(TABLE)标记-3,

22、表格的属性 2 6、bordercolor属性：指定表格或某一个单元格的边框颜色。 例：08.htm 7、Bordercolorlight属性：亮边框的颜色 8、Bordercolordark属性：暗边框的颜色例：09.htm,表格(TABLE)标记-3,表格的属性 2 9、align属性：指定表格或某一个单元格里的内容（文本、图片等）的对齐方式。 A B C 例：10.htm,表格(TABLE)标记-3,表格的属性 2 10、cellspacing属性：单元格间距。例：11.htm 11、cellpadding属性：单元格边距。 例：12.htm,表格(TABLE)标记-4,单元格属性 1、

23、valign属性：指定某一个单元格里的内容（文本、图片等）的垂直对齐方式。垂直对齐方式的属性值包括： top：顶端对齐； middle：居中对齐； bottom：底端对齐; Baseline：相对于基线对齐; D 例：13.htm,表格(TABLE)标记-5,单元格属性 2、Colspan：属性值表示当前单元格跨越几列Morning Menu 例：14.htm 3、Rowspan：属性值表示当前单元格跨越几行 例：16.htm,表格(TABLE)标记-6,行属性 1、valign属性：指定某一个单元格里的内容（文本、图片等）的垂直对齐方式。垂直对齐方式的属性值包 top：顶端对齐； middl

24、e：居中对齐； bottom：底端对齐。 Baseline：相对于基线对齐。,表格(TABLE)标记-7,行属性 2、align属性：指定表格或某一个单元格里的内容（文本、图片等）的对齐方式 3、height属性：指定表格或某一个表格单元格的高度。单位可以是%或者象素,表格进阶,表格的嵌套 在 之间插入表格，实现表格嵌套 例：17.htm 表格的作用一般只是控制文本和图像的显示，而不显示表格的边框 例：18.htm,综合案例,表格的综合使用 例：19.htm,12345,表单(FORM)标记,HTML表单是HTML页面与浏览器端实现交互的重要手段。利用表单可以收集客户端提交的有关信息。 在HT

25、ML里，我们可以定义表单，并且使表单与CGI或ASP等服务器端的表单处理程序配合。,表单(FORM)标记,表单是网页上的一个特定区域。这个区域是由一对元素定义的。 元素 action属性：用来定义表单处理程序（一个ASP、CGI等程序）的位置(相对地址或绝对地址)。 Method定义表单结果从浏览器传送到服务器的方法，一般有两种方法：get、post。,表单(FORM)标记,表单的基本语法:. =GET有数据量限制，POST无以上限制,以文件形式传输例：22.htm,表单(FORM)标记,文本框? 文本框的名字 * text,password * 默认值 * 长度 ? 最大输入字符数 例20.

26、htm,您的姓名: 密码： 留言：,表单(FORM)标记,3.文本域. 例：20.htm,表单(FORM)标记,按钮 包括普通按钮、重置按钮和提交按钮例：21.htm,表单(FORM)标记,5.复选框(Checkbox) 在一个表单里的所有多选框可以有一个或多个被选中。例25.htm,表单(FORM)标记,6.单选框(RadioButton) 一个表单里的所有变量名相同的单选框只能够有一个被选中。各个选项的name必须一样才能达到预期效果 例：26.htm 注意262.htm的写法是错误的 摇滚 爵士,表单(FORM)标记,7.下拉列表 基本语法说明说明2 例：28.htm,表单(FORM)标

27、记,7.下拉列表 （2）列表框的长度（3）允许多选例：29.htm、30.htm,表单(FORM)标记,8.图象域例：image.htm,表单(FORM)标记,综合练习（*） 实现留言簿 要求：背景、文字颜色、字体、换行、页面标题、表单文本框、文本域、单选框、复选框、下拉列表、图象域、提交与取消按钮，内容以mail形式提交。,HTML第四讲：框架,网页中的框架,制作框架页面的步骤： 1.编写所有子框架页面 2.编写主框架页面 3.在主框架页面中设定子框架名称 4.如果框架页面之间存在链接，在子框架中设定链接 注意：框架页面是不含标签的,网页中的框架,基本语法您的浏览器不支持框架，请考虑升级您的

28、浏览器！,网页中的框架,定义框架的基本语法 框架由一对定义 有两个属性：rows和cols Rows定义上下分割的框架的大小； cols定义左右分割的框架的大小； 在定义大小时，rows和cols可以使用相对大小或以百分比为单位。,网页中的框架,各窗口的尺寸设置 横排多个窗口排列方式： ABC 例：02.htm,网页中的框架,各窗口的尺寸设置 纵向排列多个窗口排列方式：A B C 例：01.htm,网页中的框架,COLS & ROWS：纵横排列多个窗口排列方式： BAC 例：14.htm,网页中的框架,框架边框的颜色 bordercolor=“ff0000“ 例：03.htm 各窗口边框的设置

29、 frameborder=#=yes, no / 1, 0 例：04.htm 框架边框的宽度 framespacing=“10“ 例：05.htm,网页中的框架,的属性 name：定义该框架的名字。这个名字可以被一些网页元素引用，如被元素引用。例：06.htm、07.htm Src：在本框架里显示网页的URL。 Target：目标框架,引用的是目标框架的名字。,网页中的框架,在当前框架中打开超链接页面 默认就是在当前框架页中打开,也可以采用Target=“_self” 在指定框架中打开超级链接页面 Target=“name” 新开窗口打开链接页面 Target=“_blank” 跳出整个框架集

30、 Target=“_parent”,网页中的框架,的属性 Scrolling：是否显示滚动条。yes, no, auto 例：08.htm Noresize：框架在浏览器里不可以被调整大小。 例：10.htm,网页中的框架,内含窗口. #=初始页面的 URL #=框架名称(Frame Name) 例：15.htm,会移动的文字,基本语法. 例：16.htm 文字移动属性 (1)方向 ：direction=# #=left, right,up,down 例：17.htm,会移动的文字,2、文字移动属性 (2)方式： behavior=# #=scroll(循环), slide(只走一次), al

31、ternate(来回走) 例：18.htm (3)循环: loop=# #=次数；若未指定则循环不止(infinite) 例：19.htm,会移动的文字,2、文字移动属性 (4)速度: scrollamount=# 例：20.htm (5)延时: scrolldelay=# 例：21.htm,会移动的文字,3、其他属性 (1)底色: bgcolor=# #=RRGGBB 16 进制颜色代码 例：22.htm (2)面积: height=# width=# 例： 23.htm (3)空白:hspace=# vspace=# 例： 24.htm,多媒体页面,用嵌入多媒体对象 基本语法 #=URL

32、注： 使用 标记之前，需要安装插件才可以； 对于不同的plugin，其embed属性也不同。 例： 25.htm(Flash动画) 例： 26.htm(rmi音乐文件) 例： 27.htm(avi动画) 例： 28.htm(mpeg影像文件),多媒体页面（*）,嵌入背景音乐#=WAV 文件的 URL#=循环数 例29.htm(WAV背景音乐), 可以使用bgsound标记来添加页面背景音乐。,多媒体页面（*）,特殊标记元素Object 元素用来包含图像、动态图像、Java小程序。 元素用以替换具体的和元素，以及和元素。 例 30.htm,HTML分析实例百度,附：HTML标记一览,文件宣告 让

33、浏览器知道这是HTML文件 开头 提供文件整体信息 标题 定义文件标题将显示于浏览器顶端 主体 设计文件格式及内容所在 排版标记 说明标记 为文件加上说明但不被显示 段落标记 为字、图、表格等之间留下一空白行 换行标记 令字、图、表格显示于下一行 水平线 插入一水平线 居中 令字、图、表格等显示于中间 预设格式 令文件按原代码的排列方式显示 定位标记 设定字、图、表格等的摆放位置 不换行 令文字不因太长而换行 建议换行 预设换行部位,附：HTML标记一览,字体标记 加重语气 产生字体加粗Bold的效果 粗体标记 产生字体加粗的效果 强调标记 字体出现斜体效果 斜体标记 字体出现斜体效果 等宽字

34、体 Courier字体，字母宽度相同 加下划线 加下划线 一级标题标记 将字体变大，级数越高越小 二级标题标记 将字体变大 三级标题标记 将字体变大 四级标题标记 将字体变大 五级标题标记 将字体变大 六级标题标记 将字体变大 字体标记 设定字体、大小、颜色 基准字体标记 设定所有字体、大小、颜色 字体加大 令字体稍微变大 字体缩小 令字体稍微缩小,加删除线 为文字加删除线 程式码 字体稍微加宽 键盘字 字体稍微加宽，单一空白 范例 字體稍為加寬 变量 斜体效果 斜体标记 斜体效果 向右缩排 文字向右缩排 述语定义 斜体效果 地址标记 斜体效果 下标字 文字下标 上标字 文字上标,附：HTML

35、标记一览,清单标记 顺序清单 清单项目将以数字、字母顺序排列 无序清单 清单项目将以实心圆点作为符号排列 清单项目 清单中的项目，一个标记一行 选项清单 可用type参数指定项目符号 目录清单 与相同 定义清单 清单分两层出现 定义条目 清单项标题 定义内容 清单项内容 表格标记表格标记 设定该表格的各项参数 表格标头 位于表格之上或之下 表格行 设定该表格的行 表格单元格 设定该表格的单元格 表格标题 相等于，但其内文字字体会变粗,附：HTML标记一览,表单标记 表单标记 决定该表单的运作模式 文字框 提供文字输入栏 输入标记 决定输入形式 选择标记 建立弹出卷动清单 选项 每一个清单选项

36、图形标记 图形标记 用来插入图形及设定图形属性 链接标记 链接标记 加入链接 基准标记 可将相对URL转绝对及指定链接 框架标记 框架设定 设定框架 窗口设定 设定框架中的窗口 页内框架 于网页中插入框架 不支持框架 设定浏览器不支持框架时的提示,附：HTML标记一览,影像地图 影像地图名称 设定影像地图名称 链接区域 设定各链接区域 多媒体 背景声音 令背景播放音乐或声音 多媒体 加入声音、音乐或影像 其他标记 走马灯 令文字走动 闪烁文字 令文字闪烁页内寻找器 可输入关键字寻找该页 开头说明 提供关于此页的信息给浏览器 关系定义 定义该文件与其他URL的关系 StyleSheet 式样表

37、控制网页版面 自订标记 独立使用或与样式表一起用,HTML的缺陷,HTML更多地关注WEB浏览器如何在页面上安排文本、图象和按纽等，过多的考虑外观使其缺乏对结构化数据的表示能力。 HTML中有限的标记不能满足很多WEB应用的需要。 是因为HTML缺乏可扩展性 从1996年开始，W3C（World Wide Web Consortium）的一个工作组设计一个超越HTML能力范围的新语言，后来被命名为XML（eXtensible Markup Language，可扩展标记语言）。,XML,XML是SGML的一个优化子集，因此也是一种元标记语言，使用者可以按需要创建新标记。 XML设计的初衷在于：如

38、果文档中的数据达到结构化，就赋予其明确的语义。这使得它具有革命性的特质和优势。 XML最大的特点就是它具有创建标签的能力。HTML中的标签是不可任意创建的，它不传递语义信息，更多情况下是描述显示信息。因此，XML具有更强的扩展性。 XML另一突出的特点就是它将数据与数据的显示分开。内容与形式相分离，可以使XML文件的编写者集中精力于数据本身，而不受显示方式的细节所影响。而它所带来的另一个好处，即不同的样式表可以使相同的数据呈现出不同的显示外观，从而适合于不同的应用，可以在不同的显示设备上显示。,1、XML的结构化文档技术, 联想电脑 联想 联想 台式机 台式机 同禧500P3 同禧500P3

39、667MHz 64MB 667 10GB 64 7999元 107999,用标记表示文档结构,使用表记表达文档的任务有两个：一是正确地表达XML文档所具有的“结构”；二是正确的传达按文档所标记的数据的含义。XML文档数据采用树型结构表达，图4-12中XML文档的树结构形式如图4-13所示。 计算机|- 类型-个人机|- 制造商-联想识别符- 品种-台式机型号-同禧500P3主频-667-单位-MHz内存-64-单位-MB硬盘-10-单位-GB单价-7999-单位-元,用DTD定义标记含义,XML的文档类型以标记集合来定义。 在制定的XML标准中，一个XML文档允许采用多个DTD。其目的是把一般

40、确定的DTD与企业独自的DTD相结合，但含义不能有异，以重新利用原有资源。因此在XML1.0标准中规定了特定DTD的“名称空间”标准。具体做法是把存储DTD的集合名称与标记并存，以防混同。,XML应用开发,开发XML应用通常涉及四个方面： 构造XML标记语言 生成XML文档 解释XML文档 显示XML文档,XML的用途-数据交换,XML使得不同计算机应用系统之间数据交换变得容易起来，这是因为它的可扩展性和文档中使用元数据。XML尤其在下列领域有重要应用。 EDI：EDI被用来在异构系统间进行数据交换而支持事务处理。 Agent（智能体）。 软件设计元素的交换。,XML的用途- Web应用,XML文档无疑将成为Web资源的重要组成部分，而且基于XML的文档资源使Web搜索引擎的智能化变得容易起来。除此之外，XML能够用来建立HTML所不能达到的多层Web应用，XML在Web应用中有下列用途。 集成不同数据源。 本地计算。 数据的多种显示。 支持Web应用的互操作和集成。,XML与HTML的综合比较,