第1章-Web基础知识

第1章Web基础知识1.1TCP/IP协议1.2Web概述1.3超文本标记语言HTML1.4可扩展标记语言XML1.5XHTML标记语言1.6Web服务器1.1TCP/IP协议1.1.1TCP/IP协议模型TCP/IP代表一个协议集，其中最重要的是TCP协议和IP协议。TCP/IP协议模型如图1.1所示，包含四个层次：应用层、传输层、网络层和物理接口层。应用层传输层网络层物理接口层1.1.2IP地址和DNS域名1.IP地址IP地址是识别Internet网络中的主机及网络设备的唯一标识。每个IP地址通常分为网络地址和主机地址两部分，长度为4个字节，由4个用“.”分隔的十进制数组成，每个数不大于255，如202.119.106.253。2.DNS域名IP地址是连网计算机的地址标识，但对大多数人来说记住很多计算机的IP地址并不是很容易的事。所以TCP/IP协议中提供了域名服务系统(DNS)，允许为主机分配字符名称，即域名。在网络通信时由DNS自动实现域名与IP地址的转换。1.2Web概述Web是一个分布式的超媒体(hypermedia)信息系统，它将大量的信息分布于整个因特网上。Web的任务就是向人们提供多媒体网络信息服务。从技术层面看，Web技术核心有三点：(1)超文本传输(HTTP)协议，实现万维网的信息传输；(2)统一资源定位符(URL)，实现互连网信息的定位统一标识；(3)超文本标记语言(HTML)，实现信息的表示欲存储。1.2.1HTTP协议1.Web的客户机/服务器模型Web客户机和Web服务器的信息传递使用HTTP协议。该模型如图1.2所示。HTTP定义的信息交互处理由以下四步组成：(1)浏览器与Web服务器建立TCP连接；(2)浏览器向Web服务器提出请求；(3)如果请求被接受，则服务器送回响应，在响应中包括状态码和所需的文件；(4)浏览器和Web服务器断开连接。1.2.1HTTP协议2.超文本和超媒体在浏览器主窗口中显示出的Web文档称为Web页面(page)，它是一种超媒体(Hypermedia)信息。超媒体信息的基础是超文本(Hypertext)信息，超文本指的是一种电子文档，其中的文字包含有可以链接到其他段落或文档的超文本链接，即超链接(Hyperlink)，利用超链接可以找到连接在因特网上的任何超文本系统，而超链接可延续，这些超文本系统分布于因特网上的众多主机上，形成庞大的分布式信息系统。1.2.2统一资源定位符URLURL通过定义资源位置的抽象标识来定位网络资源，格式如下：信息访问方式://主机:端口号/文件路径其中，信息访问方式是访问信息采用的TCP/IP应用协议，最常用的有3种，即http(超文本传输服务)、ftp(文件传输服务)和news(网络新闻服务)。主机是网络主机的域名或IP地址，它指出信息存放的主机。端口号是信息服务采用的软件端口。文件路径是所访问信息的存储路径(通常为虚拟路径而非存储文件的实际路径)。1.3超文本标记语言HTML先看一个Web页面：“学生成绩管理系统”主页面，如图1.3所示。1.3.1HTML文档的基本构成HTML文档的基本结构如下：1.3.2HTML基本标记1.文档头标记(1)HTML标记Html…/Html(2)首部标记Head…/Head(3)标题栏标记Title…/Title(4)描述标记Meta属性=值…(5)正文标记Body/Body1.3.2HTML基本标记例如：BodyBackground=images/back05.gifText=#ff0000Link=yellowALink=#00ff00系统许多标记都要用到颜色属性，颜色属性的值有3种表示方法：(1)使用颜色名称来表示。(2)使用十六进制格式数值#RRGGBB来表示(3)RGB(r,g,b)函数表示。1.3.2HTML基本标记表1.1列出了16种标准颜色。颜色名称十六进制值颜色名称十六进制值淡蓝aqua(cyan)#00FFFF海蓝navy#000080黑black#000000橄榄色oliver#080000蓝blue#0000FF紫purple#800080紫红fuchsia(magenta)#FF00FF红red#FF0000灰gray#808080银色silver#C0绿green#008000淡青teal#008080橙lime#00FF00白white#FFFFF褐红maroon#800000黄yellow#FFF001.3.2HTML基本标记2.设置文本格式(1)分段标记P属性=值…/P(2)换行标记BR(3)标题标记H1属性=值……/H1H2属性=值……/H2H3属性=值……/H3H4属性=值……/H4H5属性=值……/H5H6属性=值……/H6(4)对中标记Center…/Center1.3.2HTML基本标记(5)块标记Div属性=值……/Div(6)水平线标记Hr属性=值…(7)字体标记Font属性=值……/Font(8)字体标记B…/B粗体I…/I斜体Big…/Big大字体Small…/Small小字体TT…/TT固定宽度字体(9)样式标记Sup…/Sup上标Sub…/Sub下标U…/U下划线Strike…/Strike删除线S…/S删除线(10)原样显示标记Pre…/Pre1.3.2HTML基本标记表1.2列出了常用特殊符号的实体名称或数字表示。字符说明字符实体名数字表示字符说明字符实体名数字表示无断行空格  ；¥元符号¥¥¢美分符号¢¢；§节符号§§£英磅符号££；©版权符号©©®注册符号®®；&“and”符号&&°度°°；小于符号<<²平方符号²²；大于符号>>³立方符号³³；€欧元符号€𔚹.3.2HTML基本标记【例1.1】设计如图1.4所示的具有不同文字显示格式和段落控制的页面，相应的HTML文件中包含了文字显示和段落控制标记。1.3.2HTML基本标记源代码如下(Ex1-1.htm)：HtmlHeadTitle文字显示和段落控制/Title/HeadBodyBackground=image/fallb.jpgText=#000000CenterH1一级标题/H1/CenterHrwidth=90%color=BlueFontFace=黑体Size=7Color=Red这是黑体，大小为7号字，红色/FontBrP这是一个段落BrI这是斜体/IB这是粗体/BU这是下划线字体/UBig这是大字体/BigSmall这是小字体/Small这是下标字体Sub1/Sub这是上标字体Sup2/SupBrFontFace=楷体Size=6Color=#FF00FFIBU这些标记还可以混合使用/U/B/I/Font/PPAlign=center这是另一个段落BrB    以下是转义序列/Bbr<小于号；>大于号；&与号；"双引号；例如:a>b/P以下是一些特殊符号：Br    注册符号®Br    版权符号©/Body/Html1.3.2HTML基本标记3.列表标记(1)有序列表标记Ol属性=值…Li列表项1Li列表项2……Li列表项n/Ol(2)创建无序列表无序列表是一种在各列表项前面显示特殊项目符号的缩排列表，可以使用无序列表标记Ul和列表项标记Li来创建。UlLi列表项1Li列表项2……Li列表项n/Ul1.3.2HTML基本标记(3)描述性列表Dl…/Dl是描述性列表标记，它与其子标记Dt和Dd配合使用，用来控制数据项目的显示，类似于术语及其定义的书写格式。例如：DlDt局域网Dd局域网是指将小范围内的数据设备经过通信系统连接起来的计算机网络/DlDlDt列表描述项Dd列表项Dd列表项……Dt列表描述项……/Dl1.3.2HTML基本标记【例1.2】创建如图1.5所示的含有有序列表、无序列表和描述性列表的页面。源代码所示(Ex1-2.htm)。1.3.2HTML基本标记4.图像标记在网页中插入图像、在网页中播放视频文件。Img属性=值…常用属性有：Src=图像文件的URL地址图像可以是JPEG文件、GIF文件或PNG文件。Alt=图像的简单文本说明在浏览器下不能显示图像或图像加载时间过长时显示该文本。Height=显示图像的高度(像素或百分比)Width=显示图像的宽度(像素或百分比)如果给出了高度或宽度，则图像将按比例进行缩放。HSpace=与左右相邻对象的间隔(像素)VSpace=与上下相邻对象的间隔(像素)Align=图像不到显示区域大小时的对齐方式1.3.2HTML基本标记当在页面中进行图文混排时，可以使用Align属性设置图像与文本在垂直方向的对齐方式，此时Align属性的取值如下：top：图像与文本顶部对齐。middle：图像与文本中央对齐。bottom：图像与文本底部对齐。也可以在图像的左右绕排文本，此时Align属性的取值如下：left：图像居左文本居右。right：图像居右文本居左。1.3.2HTML基本标记在Img标记中，Dynsrc属性优先于Src属性。如果计算机具有多媒体功能，并且所指定的多媒体文件存在，则播放该多媒体文件；如果计算机没有多媒体功能，或者所指定的多媒体文件不存在，则显示由Src属性指定的图像文件。Start=何时开始播放多媒体文件其取值可以是fileopen或mouseover。Loop=多媒体文件的播放次数(整数)如果不限播放次数，则应将该属性设置为关键字infinite。LoopDelay=两次播放之间的延迟(以毫秒为单位)1.3.2HTML基本标记【例1.3】网页中的多媒体。源代码如下(Ex1-3.htm)：HtmlHeadTitle在网页中的多媒体/Title/HeadBodyPAlign=centerImgSrc=Images/njtoday.jpgAlt=今日南京HSpace=30VSpace=30/PImgSrc=Images/nj2014.jpgAlt=南京2014Height=250Width=300Border=1Align=leftImgDynSrc=Images/Clock.aviHeight=80Width=80ControlsLoop=infiniteStart=fileopen/Body/Html1.3.2HTML基本标记运行的结果如图1.6所示。1.3.2HTML基本标记(1)创建文件链接文件链接的目标端点是网页文件，该网页文件可以位于当前网页所在的服务器，常用属性如下：Href=目标端点的URL地址(可以包含一个或多个参数)Target=窗口或框架的名称目标文档将在指定的窗口或框架中打开。如果省略该属性，则目标文档将在当前窗口打开。Target属性的取值既可以是窗口或框架的名称，也可以是如下保留字：_blank：未命名的新浏览器窗口_parent：父框架页或窗门中。_self：所