基本的Web技术II.docx
《基本的Web技术II.docx》由会员分享，可在线阅读，更多相关《基本的Web技术II.docx（14页珍藏版）》请在冰豆网上搜索。
基本的Web技术II
第三讲基本的Web技术（II）
本讲包括:
一、HTML介绍分析
二、HTML的弱点及改进的途径、方向
三、CSS，XSL，DHTML，XML
一、HTML介绍分析
1、HTML---Web文档的描述性标记语言
超文本标记语言HTML是Web的信息出版语言，是设计制作Web页面的基础，通过标记和属性对超文本语义进行全面描述。
当TimBerners-Lee设想Web的时候，他所设想的是具有一个公共和容易使用的接口，使任何人能够进行信息发布，为了实现这一点，他和CERN的同事们一起开发了HyperTextMarkupLanguage,HTML使用SGML（StanddardGeneralizedMarkupLanguage）作为基础，以确保为Web开发的新标注语言的跨平台无关性。
超文本标记语言HTML是Web的信息出版语言，是设计制作Web页面的基础，通过标记和属性对超文本语义进行全面描述。
最初的HTML的规则，只用到了SGML的重要元素，这样做的好处是，可大大降低最初HTML的复杂性和网络传输超文本文档的负担。
另一个使用SGML作为HTML的基础的好处是，SGML的文档类型定义（DTD）可以使扩展HTML标准变得很容易。
2、HTML的发展过程
同其他的Internet标准一样，HTML也在不断变化之中。
下面列出了HTML的发展过程：
---1989.3,TimBerners-Lee’sfamousproposal,“mesh”.
---1992,firstversionofHTML:
hasanchors,paragraphs,lists,headings;butnotable,noimage,noform,，这些标记按文档类型定义中规定的结构化格式来表示文档信息。
尽管HTML1.0的标记数量有限，但提供超链接功能和文档基本格式化的核心标记已存在。
...
---1994,HTML2.0:
amajorstep,addingprimitiveimage,form,imagemap,...
---1996,HTML3.2:
tables,applets,textflowaroundimages,font,superscript,subscript,frame...
---1998,HTML4.0:
stylesheets,bettertablesandforms,objects,betterframe,...
---HTML+（1993）,HTML3.0（1995）:
tooaggressive,notstandard.
3、SGML与HTML
SGML（StandardGeneralizedMarkupLanguage）一种通用标注语言,为了解决不同格式文档在不同平台上交换的兼容性问题，是一种定义标记语言的语言。
它1969年起源于IBM，1986年成为国际标准ISO8879：
1986
SGML文档包括三个部分：
SGML声明，SGML声明指定应用中可以出现的字符和分隔符；
DTD（文档TYPEDEFINITION），定义标记结构的语法。
标记了文档（实际上是内容）。
三者之间的关系相当于“词法”、“语法”、“示例”
其中DTD是核心，SGML提供描述DTD的规则。
一个DTD规定文档的结构（例如段落之间的距离、表格显示的特征等）元素（例如段落、章节）和类型（例如报告、信件等），有许多用SGML描述的DTD，BUSINESSLETTERS，AIRCRAFTMANUALS，POETRY…。
HTML是SGML的一个应用，它对应SGML的一个DTD。
4．PrimitiveHTML
AnHTMLdocumentisanASCIIfilewith“marks”/tags.
DOCTYPE…>
……
anchor:
theessenceofhypertext（conceptnotfromSGML）,linkstootherfilesorthingswithincurrentfile.
…;…,
paragraph:
HTMLignorswhitespaces,use
tostartanewparagraph.
list:
ordered,unordered,definition
- …
,
,
- ….
heading:
settingupvariousheadings,
,…,
例子:
aminimumHTMLdocument
DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML3.2Final//EN">
Astudyofpopulationdynamics,
,maybeinferredfromthecontext
DOCTYPE给出的是关于DTD的信息，浏览器用来决定如何解释后面的内容。
例子:
anchor,paragraph,list,heading
5.Discussion:
HTML3.2的增强
html3.2允许ALIGN取另外两个值（align=left|right），它们指定的是图像在被显示时出现在浏览器窗口中的位置，从而有可能造成文子信息全部出现在一幅图像的左边或者右边的情形.（例子html-5,6）
结合
的扩展,文字和图像的相对摆放关系能得到更好的控制
ThisisfromChina.
1986Startsanewlinefromleftend.
这时，
标记用于在图像旁边开始新的一行。
而
标记的一个扩展属性CLEAR=left|right|all,用于指定开始一个“全新”的行,其左边,右边,或者两边都没有图像.
6．关于table:
HTML3.2的要点之一
利用rowspan和colspan
每一个
中的内容可以很丰富,list,table等 bgcolor在表中应用可得一种高效、明快的效果 7.HTML4.0介绍 7.1HTML4.0文档结构 HTML4.0特别强调将文档结构与文档表述分开。 W3C在HTML4.0的规范中，将其主要内容划分为文档结构（Structureofdocuments）、文档表述（Presentationofdocuments）和交互式文档（Interactivedocuments）三个部分。 7.2HTML4.0语言设计原则： ●互操作性 ●国际化 ●可访问性 ●表格功能 ●合成式文档 ●支持样式表 ●脚本功能 7.3HTML文档设计原则 我们知道，一般情况下，设计HTML文档，首先应考虑以下几件事情： ●Thefeaturesyouwanttoinclude ●Thestyleofthedocument ●Theaudienceforthedocument ●Theformatthematerialiscurrentlyin 那么，在具体设计HTML4.0文档时，还应遵循以下原则： ●将文档结构和文档表述分开 ●考虑面向Web的通用可访问性 ●提高用户程序（一般指浏览器）页面显示速度 HTML4.0提供了表格等设计的新功能，文档设计者应该帮助应用程序实现逐步显示，以便快速有效地利用Web。 8.HTML4.0文档设计应用 8.1HTML总体结构 同以前的版本一样，HTML4.0文档的总体结构由版本信息行、HTML头部（header）和文档主体（body）三部分组成。 HTML中用SGMLDOCTYPE结构来指定所用的HTML版本。 对于HTML4.0,文档作者应该在每个文档的第一行插入以下形式的版本信息。 对于HTML4.0的规范草案： DOCUTYPEHTMLPUBLIC“-//W3C/DTDHTML4.0Draft//EN> 对于HTML4.0的正式规范： DOCUTYPEHTMLPUBLIC“-//W3C/DTDHTML4.0Final//EN> 或 DOCUTYPEHTMLPUBLIC“-//W3C/DTDHTML4.0//EN> 对于严格遵守HTML4.0规范的情况： DOCUTYPEHTMLPUBLIC“-//W3C/DTDHTML4.0Strict//EN> 对于在W3CWeb站点上验证DTD的情况： DOCUTYPEHTMLSYSTEM“http: //www.w3.org/Markup/Cougar/relaxed.dtd”> 对于在W3CWeb站点上严格验证DTD的情况： DOCUTYPEHTMLSYSTEM“http: //www.w3.org/Markup/Cougar/strict.dtd”> 8.2HTML元素 从元素的作用范围来看，元素分为两类： 块级元素和行内元素（文本级元素） 这两类元素的区别在于： ●内容模型不同。 一般来说，块级元素可包含行内元素和其它块级元素，而行内元素通常只能包含数据和其它行内元素。 块级元素定义较大的文档结构，而行内元素，通常定义涉及较小的文档片段。 ●格式化方式不同。 默认情况下，块级元素与行内元素的格式化方式不同。 块级元素通常会开始一个新行，而行内元素通常不会。 块级元素有能力中断一个未结束的段落元素，因而在很多情况下可删除段落结束标记。 简单地讲，块级元素是段落级别的元素，而行内元素的管辖范围不超过自己所在的行。 ●方向性不同。 HTML4.0支持从左至右和从右至左两种文字方向。 由于技术原因（UNICODE的双向算法），块级元素和行内元素在继承文字方向性信息时方式不同。 8.3HTML4.0中的典型元素分析 从应用的角度来看，大体上HTML的元素可以分为以下几类： ●文档页面结构（排版）元素 ......●链接 HTML的链接是从一个Web资源到另一个Web资源的连接。 虽然概念简单，它却是Web获得成功的关键因素之一。 链接有两个端点和一个方向，即从源端开始，指向目的端。 链接可指向某种Web资源，例如HTML文档、图像、视频、声音、程序或当前文档等。 链接也可指向一个锚（anchor）。 锚是HTML文档内的命名区域，其中可包括文本和其它对象。 HTML中定义链接的元素有两个，它们是LINK和A。 LINK只能出现在HTML文档中的HEAD段中，A只能出现在HTML文档的BODY段中。 由于链接的国际化问题，主要指链接可能指向不同语言、不同书写顺序或不同字符的编码，因此A元素和LINK元素支持lang（语言）、dir（文本方向）和charset（字符编码）属性。 ◆A元素的用法大致与HTML3.2相同。 定义链接： //www.w3.org>w3c的web站点〈/a> 定义锚： 这是锚一所在位置 对锚的引用： 假定上述锚所在的文档是one.html,则对锚的链接可以采用相对URL： 详细内容请参阅锚一。 也可采用绝对URL： 详细内容请参阅如果链接与锚在同一文档中，则可直接指定： 详细内容请参阅锚一 同以前的HTML一样，仍支持通过mailtoURL来使用mailto链接。 如有任何问题和建议，请与wangsq@>我们联系. A元素定义的链接和锚是不允许嵌套的。 例如以下示例是错误的。 Thistextcontains anouteranchorandlinkandaninneranchorandlink。 ◆LINK元素用于文档的HEAD段中（出现次数不限），定义媒体无关的链接。 LINK与外部样式表 LINK与搜索引擎 可以使用LINK元素向搜索引擎提供不同的信息，包括： （1）链接到用另一种语言编写的文档版本。 （2）链接到不同媒体的文档版本，例如可打印版本。 （3）链接文档集的起始页面。 例1： 指引搜索引擎到何处查找文档的日文、法文和阿拉伯文版本，主要说明语言信息、媒体类型和链接类型在改进搜索引擎文档处理中的联合使用： rel=“alternate”href=” rel=“alternate”href=” dir=rtlrel=“alternate”href=” 例2： 指示搜索引擎使用指南的打印版本：
rel=“alternate” href=” 例3： 将搜索引擎带到文档集中的第一页。
rel=“alternate” href=” ●列表（list） 与HTML3.2大致相同，主要支持一些新属性。
●表格（table） HTML4.0的表格功能使用户能够按复杂的表格结构来组织数据。 表格的表元可以是列表、段落、表单、图形、预定义文本和其他表格。 HTML4.0的表格可按行和列进行分组，分组的目的是为了实现更复杂的表格结构。 HTML4.0的表格功能实际上是接受了MicrosoftInternetExplorer对HTML的扩充。 （IEExtension）。 讨论帮助浏览器快速显示表格的实现，主要是归于 元素中增加的属性cols。●表单（form）交互式文档 ●包容（对象、图象和小应用） HTML4.0提供了将各种资源插入到文档中的不同机制。 HTML4.0允许文档中包容对象、图象、小应用、文档和图象映射等。 ◆对象包容 大部分用户程序能够处理一些公共数据类型，例如文本、GIF图像等，如果要处理不支持数据类型，用户程序通常需要支持的外部应用程序（插件技术等）。 OBJECT元素可用来控制对象的插入和处理。 通常情况下，插入对象时需要向用户提供三种类型的信息： （1）处理机制（嵌入对象的泛称）的实现。 （2）要处理的数据。 （3）运行处理机制需要的附加值。 某些时候，也可能不需要指定全部信息。 某些机制不需要数据（比如进行动画处理的小应用），另一些机制不需要运行初始化参数。 格式 属性有: codebase=url,解析相对URL的基准路径，而相对URL由属性classid指定。 classid=url,给定实现机制所在的位置。 codetype=cdata,指定实现机制期望的MIME类型。 data=url,指定待处理数据所在的位置。 type=cdata,指定data的MIME类型，此属性可选。 ...... 例.往文档中插入一个显示动画时钟的小应用，它是用假想的语言Phthon写的,不需要任何附加的数据或运行参数值。 。 //www.mimachian.it/analogclock.py> 例、指定一个ActiveXControl,URL以协议clsid开始。 663c8fef-ief9-11cf-a3db-080036f12502” data=“ sorry,yourbrowserdoesn’tsupportActiveX! ◆图像包容
用OBJECT元素重写：
黄山照片 ◆小应用包容
绘制动画冒泡的小应用 用OBJECT元素重写： bubbles.calss”width=500height=500> 绘制动画冒泡的小应用 ◆文档包容 有时，有必要将一个HTML文档的内容插入到另一个HTML文档中，而链接到另一个文档可能并不方便。 HTML4推荐使用OBJECT元素及其data属性来实现这一功能。
警告： file-to-include.html的内容不能插入。 ●窗框（frame） HTML4.0对frame有所增强。 二、HTML的弱点及改进的途径、方向 1．WhyonlyHTMLisnotenough ●Peoplewanttomakethebrowseradesktop. ●HTMLcangrow,butinherentlylimited. ●Astrategyistomakeitageneral“container”toencompassvariousothertechnologies. Applet,script,object,stylesheet 2．改善HTML的描述能力: 多种方向与途径 CSS,DHTML,DOM,XSL,XML,… 大致可从文档结构化程度和表现力两个方面来考虑 （interactivepage和dynamicpage等问题属另外一个范畴的问题） 3．HTML的固有弱点 。 非结构化风格。 ----这体现在源文件中TAGS遍布，不严格，作者的随意性较强； ----EXTREMELYDIFFICULTTOCONVERTANYTHINGFROMHTML 。 逻辑的TAGS使网页的表现因平台而台。 。 排版表现能力弱。 网页为什么不能达到和WORD，LATEX等同样的效果。 4．pagedesigner的理想 存在创作工具（authoringtools）,有如下特性. ●丰富的表现力,例如Word. ●设计的时候,WYSIWYG,图形界面;如果不能WYSIWYG,手工做不应太复杂. ●转换成web文档后,在不同的平台上（浏览器中）看起来和设计时一样. ●空间和时间的高效率. SGML能满足上述1,3两点,但不满足2,4. HTML尤其在4上表现极好: 最初的成功所在. 5．改善HTML的描述能力的多种方向与途径 改善HTML的描述能力大致可以从文档结构化程度和表现力两个方面来考虑， 目前出现的技术有CSS、DHTML、DOM、XSL、XML等。 下面我们将对其中主要 技术作一简明介绍。 三．CSS，XSL，DHTML，XML 1、样式表（StyleSheets）----Web文档结构化表现的一种技术 从前，Web仅使用与科学计算环境中，人们对内容的重视远超过其表现。 但现在不同了，不同层次和程度的人们正在发现和使用Web，HTML的表现局限性会挫伤他们的积极性。 样式表技术就是在这样一种需求下而出现的。 它是页面设计的一项重要突破 Stylesheetsisaformatingdescriptionforadocument.Theydescribehowdocumentsarepresentedonscreens,inprint,orperhapshowtheyarepronounced.W3ChasactivelypromotedtheuseofstylesheetsontheWebsincetheConsortiumwasfoundedin1994。 . 2．CascadingStyleSheets（CSS） Web文档结构化表现（structuredformatting）的一种技术 CSSLevel1规范,1996年,W3C.http: //www.w3.org.TR/REC-CSS1 IE3.0开始支持 Netsc
展开阅读全文
相关搜索
|