Web编程技术-编程基础.ppt

Web编程技术 Web编程基础 1 潘冰panice Web编程基础 HTTP协议HTML语言CSSJavaScript语言DHTML HTTP 1HTTP概述HTTP的定义 功能 特点等 2HTTP中的有关术语请求 响应 代理 缓存等3HTTP原理4HTTP格式 教学要求 了解HTTP的定义 功能和特点 熟悉HTTP相关术语 理解HTTP工作原理 了解HTTP消息的类型与一般格式 了解HTTP请求消息的格式 理解一些重要的HTTP请求方法和请求头字段 了解HTTP响应消息的格式 理解一些重要的HTTP响应状态码和响应头字段 了解HTTP消息中实体的定义 理解一些重要的HTTP实体头字段 1HTTP概述 HTTP的全称是HyperTextTransferProtocol 即超文本传输协议 一种应用层协议 基于TCP协议 规定了客户与服务器之间交互的各种消息 1HTTP概述 Web上的文件传输通过使用HTTP协议 客户可以从Web服务器上下载几乎所有类型的文件 包括HTML文件 图像 视频 音频等多媒体文件 JavaApplet等对象 甚至应用程序等 同样 客户也可以向Web服务器上传几乎所有类型的文件 HTTP 1HTTP概述 基于Web的动态 交互应用通过使用HTTP协议 可以将用户在客户端输入的各种信息 例如 购物时需要的姓名 信用卡号等 提交给Web服务器 从而实现基于Web的动态 交互式应用 1HTTP概述 客户 服务器模式简单快速HTTP使用单个的连接来发送请求和传输文件 每个客户的请求指出了请求的方法以及该方法所作用的资源的地址或路径 1HTTP概述 无持久性连接HTTP1 0协议在每次连接时只处理一个请求 服务器处理完客户的请求 并收到客户的应答后 即断开连接 HTTP1 1中引入了永久连接 即每次连接可以处理多个请求 1HTTP概述 无状态HTTP协议是无状态协议 无状态是指协议对于事务处理没有记忆能力 对于开发基于Web的动态 交互应用而言 HTTP协议的无状态性则带来了不便 这些应用往往需要保留客户的状态 此时 应用程序的开发人员必须使用一些特别的方法来克服这一困难 1HTTP概述 不同目的的用户 掌握的程度不同 最终的浏览者 不需要了解Web应用开发人员 理解并熟练地利用Web客户端浏览软件和Web服务器的开发人员 熟练掌握并能付诸于实现 2HTTP协议工作原理 HTTP协议是基于请求 响应模式的 客户机向服务器发送请求 HTTP请求报文包含以下内容 请求方法 method 例如 get 统一资源标识符URI 协议版本号 version 通常为HTTP 1 0或HTTP 1 1 MIME类型 2HTTP协议工作原理 服务器向客户发送响应 服务器在收到客户的请求后 按照客户的要求对指定资源进行适当处理 例如检索到客户所需的文件 并给予相应的响应 HTTP响应报文包含以下内容 一个状态行 包括 消息的协议版本号 version 一个成功或错误的状态码 successorerrorcode 还可能会有实体的正文内容 bodycontent 2HTTP协议工作原理 2HTTP协议工作原理 2HTTP协议工作原理 3HTTP请求 3HTTP请求 请求行包含以下内容 请求方法URIHTTP版本号请求行结束的回车换行 CRLF 3HTTP请求 请求方法 Method 描述对于指定的资源应该执行的动作 方法字符串是大小写敏感的 3HTTP请求 1 1 1请求方法 Method 在HTTP 1 0中给出了3种请求方法 GETHEADPOST在HTTP 1 1中又引入了5种新的请求方法 PUTDELETETRACECONNECTOPTIONS 3HTTP请求 1GET方法GET方法的含义是获取由Request URI指定的任意资源 如果Request URI指向一个输出数据的过程 例 位于Web服务器上的CGI程序 那么该过程输出的数据将被作为响应消息的实体而返回 而不是返回过程的源程序 GET方法的响应有时可以被缓存系统保存 有条件的GET方法当请求消息中包含 If Modified Since 等头字段时 GET方法的语义则转变为 有条件地获取 有条件的GET方法 意味着只有当指定的资源满足头字段的要求时才会被返回 可以使客户仅通过单个请求就更新缓存中的内容 或者避免重复下载缓存中已有的内容 从而减少不必要的网络流量 3HTTP请求 3HTTP请求 捕获HTTP数据 部分的GET方法当请求消息中包含 Range 头字段时 GET方法的语义则转变为 部分地获取 部分的GET方法 意味着只传输指定资源的某些特定部分 可以使客户避免下载指定资源的已有部分 从而减少不必要的网络流量 3HTTP请求 3HTTP请求 2HEAD方法HEAD方法的响应消息中不包含消息体 即服务器并不返回客户所请求的资源 而是仅在响应消息的消息头中包含关于指定资源的一些元信息 这些元信息对资源属性作了描述 例如 最后修改时间 大小等 该方法常常用于测试服务器上资源的有效性 是否存在 可访问性以及最近是否被修改过等特征 3HTTP请求 3POST方法POST方法的作用是要求服务器将请求中包含的实体作为Request URI指定资源的一部分 如果指定的资源是服务器上的一个数据处理过程 例如CGI程序 则服务器应将请求消息中包含的实体 通常是用户在HTML页面的FORM中提交的内容 作为数据块提交给该过程 如果指定的资源是新闻组 newsgroup BBS等 则服务器应该将请求消息中包含的实体作为一篇新的文章张贴到其上 如果指定的资源是数据库 则服务器应该将请求消息中包含的实体作为一条新记录添加到其中 3HTTP请求 GET方法和POST方法GET 当客户端要从服务器中读取文档时 使用GET方法 GET方法要求服务器将URL定位的资源放在响应报文的数据部分 回送给客户端 使用GET方法时 请求参数和对应的值附加在URL后面 利用一个问号 代表URL的结尾与请求参数的开始 传递参数长度受限制 例如 index jsp id 100 op bind POST 当客户端给服务器提供信息较多时可以使用POST方法 POST方法将请求参数封装在HTTP请求数据中 以名称 值的形式出现 可以传输大量数据 3HTTP请求 4PUT方法PUT方法的作用是将请求消息中包含的实体存储到由Request URI所标识的服务器上的特定位置 如果Request URI指向一个已有的资源 请求消息中包含的实体将被作为源服务器上资源的修改版本 如果Request URI指向的资源并不存在 那么源服务器将创建该资源 并将请求消息中所包含的实体作为资源的内容 3HTTP请求 PUT方法与POST方法的区别使用POST方法的请求消息中的Request URI标识着客户希望服务器使用哪个资源来处理请求消息中包含的实体 该资源可以是一个数据处理过程 或者是其它协议的网关 新增数据用 使用PUT方法的请求消息中的Request URI标识着客户希望将请求消息中包含的实体存储到服务器上的具体位置 资源是存在的 修改数据用 3HTTP请求 5DELETE方法DELETE方法的作用是请求服务器删除Request URI所指定的资源 当服务器成功地执行了操作后 向客户返回成功的状态码 3HTTP请求 1 1 2请求URI请求URI用于指明请求方法所作用的资源 请求URI可以有四种形式 即 Request URI absoluteURI abs path authority其中 absoluteURI和abs path最为常用 AbsoluteURI 请求URI给出了绝对URI的形式表示 例如 GETHost www w3 org 3HTTP请求 请求头中的各个字段使得客户可以向服务器传送有关请求的附加信息以及有关客户本身的信息 请求头的常见字段 Accept Accept Charset Accept Encoding Accept Language Authorization connection content length From Host cookie If Modified Since If Unmodified Since If Match If None Match If Range Max Forwards Proxy Authorization Range Referer TE User Agent 3HTTP请求 Accept该字段表示客户在接收响应时所能接受的特定媒体类型 MIME MultipurposeInternetMailExtensions 多功能Internet邮件扩充服务 是描述消息内容类型的因特网标准 MIME消息能包含文本 图像 音频 视频以及其他应用程序专用的数据 例如 Accept text html 表示客户可以接受HTML文件 Accept text 表示客户可以接受各种文本文件 Accept 则表示客户可以接受所有格式文件 HTTP协议中通过使用Accept等请求头字段来实现 服务器驱动的 内容协商 3HTTP请求 常见的MIME类型超文本标记语言文本 htmltext htmlxml文档 xmltext xmlXHTML文档 xhtmlapplication xhtml xml普通文本 txttext plainRTF文本 rtfapplication rtfPDF文档 pdfapplication pdfMicrosoftWord文件 wordapplication mswordPNG图像 pngimage pngGIF图形 gifimage gifJPEG图形 jpeg jpgimage jpegau声音文件 auaudio basicMIDI音乐文件mid midiaudio midi audio x midiRealAudio音乐文件 ra ramaudio x pn realaudioMPEG文件 mpg mpegvideo mpegAVI文件 avivideo x msvideoGZIP文件 gzapplication x gzipTAR文件 tarapplication x tar任意的二进制数据application octet stream 3HTTP请求 Accept Charset客户在接收响应时所能接受的特定的字符集 Accept Encoding客户在接收响应时所能接受的编码方法 Accept Language客户在接收响应时所能接受的语言 3HTTP请求 Host该字段表示所请求的资源所在的Internet宿主机及其端口位置 端口为缺省值80 Connection表示是否需要持久连接 如 Keep Alive或HTTP1 1 默认持久连接 当网页有多个对象时 可以减少下载时间 3HTTP请求 CookieCookie是服务器在本地机器上存储一段小文本 用来在客户端保持状态 解决HTTP协议无状态的缺陷 服务器用HTTP头向客户端发送cookies 在客户终端 浏览器解析这些cookies并将它们保存为一个本地文件 它会自动将同一服务器的任何请求缚上这些cookies 3HTTP请求 If Modified Since该字段表示如果所请求的实体在某个时间之后没有被修改过 就不要返回该实体 此时 返回的响应为304 notmodified 且响应中没有消息体 该字段的目的是以最小的代价来有效地更新缓存过的资源 If Unmodified Since与If Modified Since恰恰相反 它表示 如果所请求的资源在某个时间之后没有被修改过的话 那么就对该资源执行指定的操作方法 3HTTP请求 清空缓存后访问 再刷新 响应 不带消息体 User Agent该字段给出了发起请求的客户的有关信息 通常为浏览器名称和版本号 3HTTP请求 4HTTP响应 4HTTP响应 HTTP VersionSPStatus CodeSPReason PhraseCRLFHTTP Version请求版本Status Code状态码 3位数字的整数 表示服务器试图理解并满足客户请求的结果 Reason Phrase原因说明 为 状态码 提供一个简短的文本形式的描述 通常 状态码 是供程序使用的 而 原因说明 是供用户理解的 4HTTP响应 HTTP响应状态码1xx 一般性消息 表示服务器收到客户的请求 正在进行后续处理 它们代表着服务器给出的一种暂时性的响应 此时 在响应消息中没有消息体 2xx 成功 表示服务器已经成功地接收 理解或接受了客户的请求 3xx 重定向 表示为完成请求客户代理还需要采取进一步的动作 4xx 客户错误 表示客户的请求有语法错误或不能满足 此时 服务器通常会在响应消息的消息体中对出错的原因进行解释 5xx 服务器错误 表示服务器无法完成一个正确地客户请求 4HTTP响应 HTTP常用响应状态码200OK 表示服务器已经成功地完成了客户的请求 同时 结果资源已经在响应消息的消息体中返回 对于使用GET方法的客户请求而言 响应消息的实体中包含了客户所请求的资源 例如 文件或者脚本程序的输出等 对于使用HEAD方法的客户请求而言 响应消息中仅包含了有关该资源的元信息 在实体头字段中 对于使用POST方法的客户请求而言 响应消息的实体中包含了服务器执行特定动作后的结果 例如 脚本程序的输出等 对于使用TRACE方法的客户请求而言 服务器将客户请求消息在响应消息的实体中原样返回 4HTTP响应 HTTP常用响应状态码201Created 表示服务器已经成功地完成了客户的请求并创建了一个新的资源 通常 服务器在客户使用PUT方法提出请求时返回这种响应 此时 在响应消息中往往还包含有关新创建资源的元信息 206PartialContent 表示服务器已经成功地完成了客户提出的 部分的获取 并在响应消息的实体中包含了客户所请求资源的特定部分 同时 响应消息中还会包含有 Date Content Type Content Range Cache Control 等头字段 4HTTP响应 HTTP常用响应状态码301MovedPermanently 表示客户使用Request URI所请求的资源已经被移到了新的位置 此时 服务器在返回的响应消息中将新位置的URI保存在 Location 头字段中 任何对该资源的引用和访问都应该使用该新的URI 304NotModified 如果客户使用 有条件的GET 方法 例如 使用 If Modified Since 请求头字段 来提出请求 而所请求的资源没有被修改过 那么服务器将返回该状态码 此时 响应消息中可以包含Date Cache Control 等头字段 但是不能够包含消息体 4HTTP响应 HTTP常用响应状态码400BadRequest 由于错误的语法而使得服务器无法理解客户的请求 客户必须对请求进行修改后才能够重新向服务器发送请401Unauthorized 表示服务器需要对用户进行认证后才能够完成客户的请求 此时 服务器在响应消息中要给出 WWWAuthenticate 头字段 以指明对于客户的请求服务器需要对用户进行哪些认证 例如 用户名和密码 客户在收到该响应后 可以在请求中添加 Authorization 头字段 从而在重新发送请求给服务器的同时将用户认证消息也给服务器 4HTTP响应 HTTP常用响应状态码403Forbidden 表示服务器能够理解客户对请求 但拒绝执行 此时 服务器可以在响应消息的实体中给出拒绝执行的理由 404NotFound 服务器无法找到客户在请求中所指定的资源 4HTTP响应 HTTP常用响应状态码405MethodNotAllowed 表示服务器不允许客户对Request URI所指定的资源执行特定的操作 此时 服务器会在响应消息中使用 Allow 头字段给出允许对资源所执行的各种操作 408RequestTimeout 表示客户没有在服务器规定的时间内给出请求 客户可以在其后的某个时刻重新向服务器发送请求 4HTTP响应 HTTP常用响应状态码407ProxyAuthenticationRequired 该状态码的作用与401基本类似 二者均表示需要用户提供认证信息 状态码407与401的区别在于 该响应是请求 响应链上的Proxy返回的 此时 Proxy在响应消息中要给出 Proxy Authenticate 头字段 以指明Proxy需要对用户进行哪些认证 例如 用户名和密码 客户在收到该响应后 可以在请求中添加 Proxy Authorization 头字段 从而在重新发送请求时将用户认证消息也发给Proxy 4HTTP响应 HTTP常用响应状态码500InternalServerError 表示服务器遇到了一种无法预知的情况 使得它无法完成客户的请求 503ServiceUnavailable 表示服务器当前由于临时性过载或者维护等原因而无法处理客户请求 该响应意味着这是一种临时的情况 在一定的时间后服务器就可能恢复 在响应消息中 服务器可以使用 Retry After 头字段来指明服务器恢复所需要的时间 505HTTPVersionNotSupported 表示服务器不支持客户请求消息中包含的版本号 在响应消息的实体中 服务器可以给出它所支持的协议 4HTTP响应 关于服务器的各种信息发送给客户 这些附加信息往往是以 头字段 的形式包含在响应消息中 响应头的字段 ServerAccept Ranges Age ETag Location Proxy Authenticate Retry AfterVary WWW Authenticate 4HTTP响应 Server有关源服务器处理客户的请求的服务器软件信息 通常为软件名称和版本号 如 MicrosoftIIS会给出头字段 Server Microsoft IIS 5 0 Unix上常用的Web服务器Apache则会给出头字段 Apache 1 3 14 Unix PHP 4 0 3 对于客户而言 知道了服务器的信息可以更好的定制请求消息以充分利用服务器的能力并避开服务器的缺陷 但是 公共服务器软件信息也会给服务器带来安全隐患 某些恶意的客户在知道了服务器的软件信息后 可以利用该软件已知的安全漏洞来攻击服务器 5HTTP实体 所谓的实体 Entity 是指作为请求或者响应消息的有效载荷而传输的信息 实体由 实体头 和 实体正文 组成 有些消息仅能够包含实体头而不能够包含实体正文 例如 HEAD方法的响应消息 有些消息既不能够包含实体头也不能够包含实体正文 例如使用GET方法的请求消息 5HTTP实体 实体头字段定义了资源的元信息 metainformation 即关于信息的信息 实体头字段分为10余种 即 entity header Allow Content Encoding Content Language Content MD5 Content Length Content Location Content Range Content Type Expires Last Modified 5HTTP实体 Allow该字段列出了资源所支持的操作的集合 其目的是将有关资源的合法操作通知接收者 示例 Allow GET HEAD PUT 表示允许客户对资源进行GET HEAD和POST操作 当客户想在服务器上创建或者更新资源时 会向服务器发送带有PUT方法的请求消息 此请求消息中通常会包含 Allow 字段 这样 客户就可以给出该新建或者更新后的资源所支持的方法 当客户使用某种服务器不支持的方法来操作资源时 服务器会给出状态码为405的响应 同时会在响应消息中使用 Allow 字段来通知客户对该资源允许使用哪些操作方法 5HTTP实体 Content Type该字段指出了发送给接收者的消息中所包含的实体正文的媒体类型 这样接收者就能够根据媒体类型对资源进行适当的处理 HTTP协议使用InternetMediaTypes来描述资源的媒体类型 其格式为 media type type subtype parameter 其中 type是表示媒体类型的字符串subtype是表示媒体子类型的字符串parameter是对媒体类型的进一步说明或限定 它采用 属性 值 对的格式 例如 Content Type text html charset ISO 8859 4 表示资源的类型为 text 子类型为 html 且所使用的字符集为 ISO 8859 4 5HTTP实体 Content Encoding该字段是资源媒体类型的限定符 它表示对消息中的实体采用了何种压缩方法 有时 在存储或者传送资源时会对该资源进行压缩 从而减少其占用空间或者加快传送速度 Content Encoding 字段的目的就是为了通知接收者所传送资源的压缩方法 这样 接收者就能够采用适当的方法对资源进行解压缩 在此基础上再根据资源的媒体类型进行相应的处理 示例 Content Encoding gzip 表示消息中包含的实体使用gzip方法压缩 5HTTP实体 Content Language该字段表示消息中包含的实体的自然语言 该字段的目的是使得最终用户可以根据自己在语言上的需要来选择合适的资源 例如 Content Language en 表示该资源适合于英语用户 Content Length该字段表示消息中所包含实体正文的大小 以字节为单位 例如 Content Length 500 说明资源大小为500bytes 5HTTP实体 Content Range该字段表示当前所发送的实体是整个资源的一部分 同时指出了该部分在整个资源中的位置 当客户使用 部分的GET 方法时 服务器的响应消息中通常会包含该字段 例如 Content Range bytes500 999 1234 表示当前消息中包含的实体是长度为1234bytes的资源中从第500byte到第999byte的一部分 Last Modified该字段表示消息中所包含资源的最后修改日期和时间 例如 Last Modified Wed 15Nov200904 58 08GMT 表示资源的最后修改日期为 Wed 15Nov200904 58 08GMT 客户通常使用该字段来判断自己目前所拥有的资源是否为最新版本 如果是 那么就没有必要重新下载资源 如果不是 那么再使用GET方法来获取最新版本 5HTTP实体 实体正文 entity body 为资源内容本身 当消息中包含实体正文时 实体正文的数据格式和编码由实体头字段 Content Type Content Encoding 的取值而决定 即 entity body Content Encoding Content Type data 其中 Content Type 给出数据的媒体类型 Content Encoding 则给出了通常出于压缩等目的而附加于数据之上的内容编码 小结 HTTP客户与服务器之间的交互是由消息驱动的 由客户发送一个请求消息开始 到服务器返回一个响应消息结束 客户所需要访问的资源 HTTP协议从语法和语义两个方面对客户与服务器之间所交换的消息进行定义和描述 利用HTTP协议中定义的各种消息 客户 服务器除了实现资源共享和交换 参考资料 IETF shomepageforHTTP http www ics uci edu pub ietf http W3C shomepageforHTTP Http www w3c org Protocols Berners Lee T Fielding R andH Frystyk HypertextTransferProtocol HTTP 1 0 RFC1945 May1996 R Fielding J Gettys J C Mogul H Frystyk L Masinter P Leach T Berners Lee HypertextTransferProtocol HTTP 1 1 RFC2616 June1999 HTTP协议 作业 利用网络嗅探器Sniffer或Ethereal捕获HTTP协议消息 并分析其工作过程 熟悉HTTP请求和响应的头部格式和相关信息 Web编程基础 HTTP协议HTML语言CSSJavaScript语言DHTML HTML 1HTML简介2HTML基础3参考资料 1HTML简介 HTML HyperTextMarkupLanguage 简记为HTML 超文本标记语言 是TimBerners Lee在CERN 在日内瓦的欧洲粒子物理实验室 发明的 它能够将信息以超文本的形式组织起来 从而便于用户浏览 用户可以快速地从一个页面移到另一个页面 通过使用一系列的标记 Tag 将文档表示成各种不同元素的集合 例如 标题 段落 列表 图片 超链等 可以为各类 各个 逻辑元素指定展现风格 例如 颜色 字体 1HTML简介 超文本作为一种信息管理方式 其本质含义是非线性的文档组织 在这种方式中 信息被组织在一系列离散的结点 node 中 结点之间通过链 link 建立联系 从而形成网状的信息结构 1HTML简介 信息发布信息发布是HTML的设计初衷和基本功能 发布联机文档 其中可以包含文本 图像 声音等多种媒体信息 在信息之间建立超链接 以反映彼此之间的关联 便于用户浏览 网上应用提供表单 form 以供用户与远程服务器之间开展事务 transaction 型应用 例如 检索信息 定购产品等 在文档中嵌入spread sheet videoclip等各种应用 这些应用程序可以使用ActiveXControl Script JavaApplet等手段来实现 1HTML简介 HTML不是程序语言 它只是一种标记语言 一种文本语言 它只是在一些对象 如文本 图片 表格等 中加入各种各样的标记 从而使这些对象以这些标记所定义的形式显示出来 任何文本编辑器都可以编辑它 只要能将文件另存成ASCII纯文本格式即可 需要使用Web浏览器 浏览器就相当于HTML语言的翻译程序 负责解释HTML文件各种符号的含义 HTML语言独立于各种平台 它能独立于各种操作系统平台 如UNIX Windows等 1HTML简介 1HTML简介 显示 HelloWorld 的网页文件代码HelloWorld HelloWorld Thisismyfirstpage 2HTML基础 HTML语法HTML文档的结构字体文字布局图像表单表格多窗口页面文字的移动 基本的HTML语法所有的标记都必须用尖括号 即 括起来 大部分标记是成对出现的 包括开始标记和结束标记 结束标记与开始标记名称相同 必须用一个斜线符号开头 所有被标记包围的对象 如文本 图像 表格等都按照标记定义的格式显示 例如 欢迎访问本网页 有少数标记允许只有开始标记没有结束标记 例如 断行用的标记 分段用的标记 标记不区分大小写 但默认情况下 ASP NET2 0中都用小写字母表示 2HTML基础 标记的属性控制标记的作用 设置或改变属性时 将 属性名 值 放在标记名的同一个尖括号中 而且所有属性都放置在开始标记的尖括号内 例如 本段落右端对齐其中p是段落标记 align代表 对齐方式 是属性名 right代表 右边 是属性的值 这个标记的含义是将字符串放在浏览器的右端 其中hr是水平线标记 size是水平线的高度 width是水平线的宽度 align为对齐属性 此行代码表示增加一条横线 水平线的高度为6 宽度为160 显示于浏览器的中间 2HTML基础 注释语句编译器将不解读注释部分 即注释不在浏览器窗口中显示出来 注释语句的格式是 这里不妨将它看作一种特殊的标志 例如 2HTML基础 2HTML基础 HelloWorld HelloWorld Thisismyfirstpage 标志HTML文档的开始和结束 头信息包含标题 CSS样式表 JavaScript脚本等不在浏览器窗口中显示 HTML文档正文在浏览器窗口中显示 超文本文件分析 一个基本的HTML文档通常包含以下三对顶级标记 1 HTML标记 HTML标记是全部文档内容的容器 是开始标记 是结束标记 它们分别是网页的第一个标记和最后一个标记 标记是可选的 但最好不要省略这两个标记 2 首部标记 首部标记用于提供与网页有关的各种信息 在首部标记中 可以使用和标记来指定网页的标题 使用和标记来定义CSS样式表 使用和标记来插入脚本 3 正文标记 正文标记包含了文档的内容 文字 图像 动画 超链接以及其他HTML对象均位于该标记中 2HTML基础 2HTML基础 HelloWorld HelloWorld Thisismyfirstpage 2 1文档首部 TITLE元素每个HTML文档在文档头部分必须有一个TITLE元素 该元素可用于概括文档的内容 浏览器通常将TITLE元素显示在文档窗口的标题中 title属性使用该属性来为元素提供概括信息 浏览器可以采用多种方式来显示该属性 2HTML基础 META元素meta是用来在HTML文档中模拟HTTP协议的响应头报文 meta标签用于网页的与中 meta标签的用处很多 meta的属性有两种 name和http equiv 2HTML基础 META元素 name属性1 说明生成工具 2 向搜索引擎说明你的网页的关键词 3 告诉搜索引擎你的站点的制作的作者 2HTML基础 META元素 name属性4 其中的属性说明如下 设定为all 文件将被检索 且页面上的链接可以被查询 设定为none 文件将不被检索 且页面上的链接不可以被查询 设定为index 文件将被检索 设定为follow 页面上的链接可以被查询 设定为noindex 文件将不被检索 但页面上的链接可以被查询 设定为nofollow 文件将不被检索 页面上的链接可以被查询 2HTML基础 META元素 http eqiv属性1 和说明主页制作所使用的文字以及语言2 定时让网页在指定的时间n内 跳转到页面http yourlink 3 用于设定网页的到期时间 一旦过期则必须到服务器上重新调用 必须使用GMT时间格式 4 用于设定禁止浏览器从本地机的缓存中调阅页面内容 设定后一旦离开网页就无法从Cache中再调出 2HTML基础 2 2文档正文 正文标记包含了文档的内容 文字 图像 动画 超链接以及其他HTML对象均位于该标记中 正文标记有下列属性 BACKGROUD 指定文档背景图像的URL地址 BGCOLOR 指定文档的背景颜色 TEXT 指定文档中文本的颜色 LINK 指定文档中链接的颜色 关于链接的介绍请参阅后面章节 VLINK 指定文档中已被访问过的链接的颜色 ALINK 指定文档中正被选中的链接的颜色 ONLOAD 指定文档首次加载时调用的事件处理程序 ONUNLOAD 用于指定文档卸载时调用的事件处理程序 颜色属性的值有两种表示方法 使用颜色名称来指定 例如红色 绿色和蓝色分别用red green和blue表示 使用十六进制格式数值 RRGGBB来表示 RR GG和BB分别表示颜色中的红 绿 蓝三基色的两位十六进制数据 2HTML基础 3 1标题字体 Header 1 2 3 4 5 6今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 这些标记显示黑体字 这些标记自动插入一个空行 不必用标记再加空行 因此在一行中无法使用不同大小的字体 2HTML基础 3 2字体大小 1 2 3 4 5 6 7今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 今天天气真好 2HTML基础 3 3物理字体 black italic underlineandsoon 2HTML基础 3 4字体颜色 R g b 红 绿 蓝 red green blue RGB 分别用16进制的值 0 f 来表示 2HTML基础 4 1行的控制段 Paragraph 你好吗 很好 你好吗 很好 2HTML基础 换行你好吗 很好 你好吗 很好 不换行content 4 2文字的对齐 left center right 2HTML基础 4 3文字的分区 Division 显示 Canyoufeelhappinesswithoutunpleasant Pleaseshowmeyoursmile 2HTML基础 4 4列表无序列表 TodayTommorow有序列表 TodayTommorow定义列表 Definitionlists TodayTodayisyesterday TomorrowTomorrowistoday 2HTML基础 5 1超链接的含义 超链接 是HTML语言的精华 HTML使用标签来创建一个链接到其他文件的链接 它可以指向网络上的任何资源 包括HTML页面 声音 图像 视频等 如 欢迎访问暨南大学其中target属性指定在那里打开要访问的页面 2HTML基础 5 2超链接的形式文件超链接 链接的目标端点是一个文件 锚点超链接 链接的目标端点是网页中的一个位置 通过这种链接可以从当前网页跳转到本页面或其他页面中的指定位置 E mail链接 可以启动电子邮件客户端程序 如Outlook 并允许访问者向指定的地址发送邮件 图像超链接 在图像上建立若干个区域称为 链接区 通过它可以跳转到其他目标端点去 2HTML基础 5 3路径绝对路径 也称为绝对URL 给出目标文件的完整URL地址 相对路径 也称为相对URL 是指以当前文档所在位置为起点到目标文档所经过的路径 使用时省去当前文档与目标文档完整URL中的相同部分 只留下不同部分 根相对路径 是指从站点根目录到被链接文件的路径 使用这种路径是指定站点内文档链接的最好方式 2HTML基础 5 4常见链接的创建 1 创建文件链接 2 创建锚点链接 3 创建邮件链接 4 创建图像超链接 2HTML基础 1 创建文件链接使用A标记来创建超链接 基本语法格式如下 文本基本属性 HREF 必选项 用于指定目标端点的URL地址 可以包含一个或多个参数 如果是与站点内页面链接 则为文件名 TARGET 可选项 用于指定一个窗口或框架的名称 目标文档将在该窗口或框架中打开 省略该属性 则目标文档将取代包含该超链接的文档 blank 指定将链接的目标文件加载到未命名的新浏览器窗口中 parent 指定将链接的目标文件加载到包含链接的父框架页或窗口中 self 指定将链接的目标文件加载到链接所在的同一框架或窗口中 这是默认值 top 指定将链接的目标文件加载到整个浏览器窗口中 并由此删除所有框架 TITLE 可选项 用于指定指向超链接时所显示的标题文字 2 创建锚点链接通过创建锚点链接 可以使超链接指向当前页面或其他页面中的指定位置 首先 定义锚点 在页面中为需要跳转的位置上定义一个A标记并通过NAME属性为该位置指定一个名称 例如 可以使用A标记在test htm页面顶部创建一个锚点 然后 使用A标记来创建指向该锚点的超链接 例如 要在同一个页面中跳转到名为 top 的锚点处 可以使用以下HTML代码 返回顶部若要在其他页面中跳转到该锚点 则使用以下HTML代码 跳转到test htm页的顶部 2HTML基础 3 创建邮件链接使用A标记创建邮件链接 该标记的HREF属性应由三个部分组成 第一部分是电子邮件协议名称mailto 第二部分是电子邮件地址 第三部分是可选的邮件主题 其形式为 subject 主题 第一部分与第二部分之间用冒号 分隔 第二部分与第三部分之间用问号 分隔 例如 给我写信当访问者在浏览器窗口中单击邮件链接时 将会自动启动电子邮件客户端程序 例如OutlookExpress或FoxMail等 并将指定的主题填入 主题 栏中 2HTML基础 4 创建图像超链接将 标记放在图片两端即可 例如语句 当单击dysb jpg图片时将转向Default htm网页 2HTML基础 5 5示例 1 创建指向本地页面的链接 链接到本地磁盘上同一目录下的页面 链接到本地磁盘上不同目录下的页面 2 创建指向其他服务器的页面链接 链接到Internet上其他服务器上的页面 3 创建一个指向页面特定部分的链接 链接到本页面内的某指定位置 链接到其他服务器上页面的某指定位置 4 创建一个指向电子邮件的链接 2HTML基础 6 1图像的类型PNG PortableNetworkGraphic 类型网络图像中的通用格式 使用一种无损压缩的方法 最多可支持32位颜色 但它不支持动画 如果没有相应的插件 有的浏览器