《网站规划与网页设计.ppt》由会员分享,可在线阅读,更多相关《网站规划与网页设计.ppt(55页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、网站规划与网页设计 Still waters run deep.流静水深流静水深,人静心深人静心深 Where there is life,there is hope。有生命必有希望。有生命必有希望4.1 XHTML4.1 XHTML简介简介简介简介4.2 XHTML4.2 XHTML文档的基本结构文档的基本结构文档的基本结构文档的基本结构4.3 4.3 网页文件的创建过程网页文件的创建过程网页文件的创建过程网页文件的创建过程4.4 4.4 段落标记段落标记段落标记段落标记4.5 4.5 文字标记文字标记文字标记文字标记4.6 4.6 超链接超链接超链接超链接4.7 4.7 图像图像图像图像4
2、.8 4.8 表格表格表格表格4.9 4.9 框架(多窗口页面)框架(多窗口页面)框架(多窗口页面)框架(多窗口页面)4.10 4.10 表单表单表单表单 第第4章章 XHTML 基础基础4.1.1 XHTML4.1.1 XHTML4.1.1 XHTML4.1.1 XHTML的产生的产生的产生的产生 l l HTML HTML语言依然有缺陷和不足,人们仍在不断的改进它,语言依然有缺陷和不足,人们仍在不断的改进它,语言依然有缺陷和不足,人们仍在不断的改进它,语言依然有缺陷和不足,人们仍在不断的改进它,使它更加便于控制和有弹性,以适应网络上的应用需求。使它更加便于控制和有弹性,以适应网络上的应用需
3、求。使它更加便于控制和有弹性,以适应网络上的应用需求。使它更加便于控制和有弹性,以适应网络上的应用需求。l l 2000 2000年,年,年,年,W3CW3C组织公布发行了组织公布发行了组织公布发行了组织公布发行了XHTML 1.0XHTML 1.0版本。版本。版本。版本。l l XHTML 1.0 XHTML 1.0是一种在是一种在是一种在是一种在HTML 4.0HTML 4.0基础上优化和改进的新语基础上优化和改进的新语基础上优化和改进的新语基础上优化和改进的新语言,目的是基于言,目的是基于言,目的是基于言,目的是基于XMLXML应用。应用。应用。应用。l l XHTML XHTML是一种
4、增强了的是一种增强了的是一种增强了的是一种增强了的HTMLHTML,它的可扩展性和灵活性,它的可扩展性和灵活性,它的可扩展性和灵活性,它的可扩展性和灵活性将适应未来网络应用更多的需求。将适应未来网络应用更多的需求。将适应未来网络应用更多的需求。将适应未来网络应用更多的需求。4.1 XHTML4.1 XHTML简介简介简介简介4.1.2 XHTML4.1.2 XHTML4.1.2 XHTML4.1.2 XHTML的优点的优点的优点的优点 XHTML XHTML 内容既符合内容既符合内容既符合内容既符合XMLXML,并且如果依照一些简单的指,并且如果依照一些简单的指,并且如果依照一些简单的指,并且
5、如果依照一些简单的指导方针,也能被导方针,也能被导方针,也能被导方针,也能被HTML 4.0HTML 4.0用户代理程序识别。用户代理程序识别。用户代理程序识别。用户代理程序识别。1 1XHTMLXHTML文档遵从文档遵从文档遵从文档遵从XMLXML标准标准标准标准 用标准的用标准的用标准的用标准的XMLXML工具很容易查看、编辑和检验它们工具很容易查看、编辑和检验它们工具很容易查看、编辑和检验它们工具很容易查看、编辑和检验它们.在现有的在现有的在现有的在现有的HTML 4.0HTML 4.0代理用户程序中使用,也可以在新的代理用户程序中使用,也可以在新的代理用户程序中使用,也可以在新的代理用
6、户程序中使用,也可以在新的XHTMLXHTML用户用户用户用户代理程序中使用,在后者中使用可以达到与前者同样或更好代理程序中使用,在后者中使用可以达到与前者同样或更好代理程序中使用,在后者中使用可以达到与前者同样或更好代理程序中使用,在后者中使用可以达到与前者同样或更好的效果。的效果。的效果。的效果。2 2在在在在XHTMLXHTML文档中可使用更多的应用程序文档中可使用更多的应用程序文档中可使用更多的应用程序文档中可使用更多的应用程序 XHTML XHTML文档中使用的应用程序(如文档中使用的应用程序(如文档中使用的应用程序(如文档中使用的应用程序(如ScriptScript和和和和Appl
7、etApplet)可以是可以是可以是可以是HTMLHTML的文档对象模型的文档对象模型的文档对象模型的文档对象模型DOMDOM,也可以是,也可以是,也可以是,也可以是XMLXML的的的的DOMDOM。4.1 XHTML4.1 XHTML简介简介简介简介4.1.3 XHTML4.1.3 XHTML代码规范代码规范代码规范代码规范 1 1所有的标记都必须有一个相应的结束标记所有的标记都必须有一个相应的结束标记所有的标记都必须有一个相应的结束标记所有的标记都必须有一个相应的结束标记单独不成对的标签,则在标签最后加一个单独不成对的标签,则在标签最后加一个单独不成对的标签,则在标签最后加一个单独不成对的
8、标签,则在标签最后加一个“/”“/”来关闭它来关闭它来关闭它来关闭它 一定写对应的一定写对应的一定写对应的一定写对应的 img/2 2所有标签的元素和属性的名字都必须使用小写所有标签的元素和属性的名字都必须使用小写所有标签的元素和属性的名字都必须使用小写所有标签的元素和属性的名字都必须使用小写 XHTML XHTML对大小写是敏感的。对大小写是敏感的。对大小写是敏感的。对大小写是敏感的。XHTMLXHTML要求所有的标签和要求所有的标签和要求所有的标签和要求所有的标签和属性的名字都必须使用小写字母。属性的名字都必须使用小写字母。属性的名字都必须使用小写字母。属性的名字都必须使用小写字母。4.1
9、 XHTML4.1 XHTML简介简介简介简介4.1.3 XHTML4.1.3 XHTML代码规范代码规范代码规范代码规范 3 3所有的标记都必须合理嵌套所有的标记都必须合理嵌套所有的标记都必须合理嵌套所有的标记都必须合理嵌套 错误错误错误错误 按照按照按照按照XHTMLXHTML要求必须修改为:要求必须修改为:要求必须修改为:要求必须修改为:/p/p 4 4所有的属性必须用引号括起来所有的属性必须用引号括起来所有的属性必须用引号括起来所有的属性必须用引号括起来在在在在HTMLHTML中可写为:中可写为:中可写为:中可写为:而按照而按照而按照而按照XHTMLXHTML要求必须修改为:要求必须修
10、改为:要求必须修改为:要求必须修改为:4.1 XHTML4.1 XHTML简介简介简介简介4.1.3 XHTML4.1.3 XHTML代码规范代码规范代码规范代码规范 5 5特殊符号特殊符号特殊符号特殊符号“”“”“”和和和和“&”“&”用编码表示用编码表示用编码表示用编码表示 小于(小于(小于(小于()号,不是标签一部分的,必须被编码为)号,不是标签一部分的,必须被编码为)号,不是标签一部分的,必须被编码为)号,不是标签一部分的,必须被编码为>>;(&)号,不是实体的一部分的,必须被编码为)号,不是实体的一部分的,必须被编码为)号,不是实体的一部分的,必须被编码为)号,不是实体的一部
11、分的,必须被编码为&&。6 6每个属性必须赋值每个属性必须赋值每个属性必须赋值每个属性必须赋值 XHTMLXHTML规定所有属性都必须有一个值,没有值的就重复规定所有属性都必须有一个值,没有值的就重复规定所有属性都必须有一个值,没有值的就重复规定所有属性都必须有一个值,没有值的就重复本身。例如:本身。例如:本身。例如:本身。例如:td 按照按照按照按照XHTMLXHTML要求必须修改为:要求必须修改为:要求必须修改为:要求必须修改为:td nowrap=nowrap input type=checkbox name=shirt value=medium checked=checke
12、d/7 7不要在注释内容中使用不要在注释内容中使用不要在注释内容中使用不要在注释内容中使用“-”“-”“-”“-”只能出现在只能出现在只能出现在只能出现在XHTMLXHTML注释的开头和结束位置。注释的开头和结束位置。注释的开头和结束位置。注释的开头和结束位置。4.1 XHTML4.1 XHTML简介简介简介简介 1.1.标记标记标记标记 XHTML XHTML文档由标记和被标记的内容组成。格式为:文档由标记和被标记的内容组成。格式为:文档由标记和被标记的内容组成。格式为:文档由标记和被标记的内容组成。格式为:受标记影响的内容受标记影响的内容受标记影响的内容受标记影响的内容/我的第一个网页我的
13、第一个网页我的第一个网页我的第一个网页 需要注意需要注意需要注意需要注意:每个标记都要用每个标记都要用每个标记都要用每个标记都要用“”“”“”(大于号)(大于号)(大于号)(大于号)括起来,如括起来,如括起来,如括起来,如,以表示这是,以表示这是,以表示这是,以表示这是XHTMLXHTML代码而非代码而非代码而非代码而非普通文本。普通文本。普通文本。普通文本。“”“”“”与标记名之间不能留有空格或其他与标记名之间不能留有空格或其他与标记名之间不能留有空格或其他与标记名之间不能留有空格或其他字符。字符。字符。字符。在标记名前加上符号在标记名前加上符号在标记名前加上符号在标记名前加上符号“/”“/
14、”便是其结束标记,表示该便是其结束标记,表示该便是其结束标记,表示该便是其结束标记,表示该标记内容的结束,如标记内容的结束,如标记内容的结束,如标记内容的结束,如。标记也有不用。标记也有不用。标记也有不用。标记也有不用/结尾结尾结尾结尾的,称之为单标记。的,称之为单标记。的,称之为单标记。的,称之为单标记。4.2 XHTML4.2 XHTML文档的基本结构文档的基本结构文档的基本结构文档的基本结构4.2.1 4.2.1 标记及其属性标记及其属性标记及其属性标记及其属性2.2.标记的属性标记的属性 标记只是规定这是什么信息,或是文本,标记只是规定这是什么信息,或是文本,或是图片,但怎样显示或控制
15、这些信息,就或是图片,但怎样显示或控制这些信息,就需要在标记后面加上相关的属性来表示,每需要在标记后面加上相关的属性来表示,每个标记有一系列的属性。格式为:个标记有一系列的属性。格式为:2 受影响的内容受影响的内容/欢迎!欢迎!欢迎!欢迎!4.2 XHTML4.2 XHTML文档的基本结构文档的基本结构文档的基本结构文档的基本结构4.2.1 4.2.1 标记及其属性标记及其属性标记及其属性标记及其属性 XHTMLXHTML文档是一种纯文本格式的文件,文档是一种纯文本格式的文件,文档是一种纯文本格式的文件,文档是一种纯文本格式的文件,XHTMLXHTML文文文文档的基本结构为:档的基本结构为:档
16、的基本结构为:档的基本结构为:!DOCTYPE html PUBLIC-/W3C/DTD XHTML 1.0!DOCTYPE html PUBLIC-/W3C/DTD XHTML 1.0!DOCTYPE html PUBLIC-/W3C/DTD XHTML 1.0 xhtml1/DTD/xhtml1-transitional.dtdxhtml1/DTD/xhtml1-transitional.dtdxhtml1/DTD/xhtml1-transitional.dtd meta http-equiv=Content-Type content=text/html;meta http-equiv=C
17、ontent-Type content=text/html;meta http-equiv=Content-Type content=text/html;charset=gb2312/charset=gb2312/charset=gb2312/网页的标题网页的标题网页的标题网页的标题 网页的内容网页的内容网页的内容网页的内容 【例【例【例【例4-14-1】4.2 XHTML4.2 XHTML文档的基本结构文档的基本结构文档的基本结构文档的基本结构 4.2.2 XHTML4.2.2 XHTML的基本结构的基本结构的基本结构的基本结构 【说明】【说明】【说明】【说明】DOCTYPEDOCTYPE必
18、须为大写。必须为大写。必须为大写。必须为大写。DTD DTD叫做文档类型定义,里面包含了文档的规则。浏叫做文档类型定义,里面包含了文档的规则。浏叫做文档类型定义,里面包含了文档的规则。浏叫做文档类型定义,里面包含了文档的规则。浏览器根据定义的览器根据定义的览器根据定义的览器根据定义的DTDDTD来解释页面的标记,并显示出来。要建来解释页面的标记,并显示出来。要建来解释页面的标记,并显示出来。要建来解释页面的标记,并显示出来。要建立符合标准的网页,立符合标准的网页,立符合标准的网页,立符合标准的网页,DOCTYPEDOCTYPE声明是必不可少的关键组成声明是必不可少的关键组成声明是必不可少的关键
19、组成声明是必不可少的关键组成部分。部分。部分。部分。DOCTYPEDOCTYPE声明必须放在每一个声明必须放在每一个声明必须放在每一个声明必须放在每一个XHTMLXHTML文档的最顶文档的最顶文档的最顶文档的最顶部,在所有代码和标记之前。部,在所有代码和标记之前。部,在所有代码和标记之前。部,在所有代码和标记之前。4.2 XHTML4.2 XHTML文档的基本结构文档的基本结构文档的基本结构文档的基本结构 4.2.2 XHTML4.2.2 XHTML的基本结构的基本结构的基本结构的基本结构 【说明】【说明】【说明】【说明】“xmlns”“xmlns”是是是是XHTML namespaceXHT
20、ML namespace的缩写,称为的缩写,称为的缩写,称为的缩写,称为“名名名名字空间字空间字空间字空间”。由于。由于。由于。由于XHTMLXHTML是是是是HTMLHTML向向向向XMLXML过渡的标记语言,过渡的标记语言,过渡的标记语言,过渡的标记语言,它需要符合它需要符合它需要符合它需要符合XMLXML文档规则,因此也需要定义名字空间。又因文档规则,因此也需要定义名字空间。又因文档规则,因此也需要定义名字空间。又因文档规则,因此也需要定义名字空间。又因为为为为XHTML1.0XHTML1.0不能自定义标记,所以它的名字空间都相同,不能自定义标记,所以它的名字空间都相同,不能自定义标记,
21、所以它的名字空间都相同,不能自定义标记,所以它的名字空间都相同,就是就是就是就是http:/www.w3.org/1999/xhtmlhttp:/www.w3.org/1999/xhtml。第第第第5 5行定义语言编码。为了被浏览器正确解释和通过行定义语言编码。为了被浏览器正确解释和通过行定义语言编码。为了被浏览器正确解释和通过行定义语言编码。为了被浏览器正确解释和通过W3CW3C代码校验,所有的代码校验,所有的代码校验,所有的代码校验,所有的XHTMLXHTML文档都必须声明它们所使用文档都必须声明它们所使用文档都必须声明它们所使用文档都必须声明它们所使用的编码语言。一般使用的编码语言。一般
22、使用的编码语言。一般使用的编码语言。一般使用gb2312gb2312(简体中文)。(简体中文)。(简体中文)。(简体中文)。4.2 XHTML4.2 XHTML文档的基本结构文档的基本结构文档的基本结构文档的基本结构 4.2.2 XHTML4.2.2 XHTML的基本结构的基本结构的基本结构的基本结构 用最简单的用最简单的用最简单的用最简单的“记事本记事本记事本记事本”来编辑网页。来编辑网页。来编辑网页。来编辑网页。打开记事本。单击打开记事本。单击打开记事本。单击打开记事本。单击WindowsWindows的的的的“开始开始开始开始”按钮,在按钮,在按钮,在按钮,在“程序程序程序程序”菜单中的
23、菜单中的菜单中的菜单中的“附件附件附件附件”子菜单中单击子菜单中单击子菜单中单击子菜单中单击“记事本记事本记事本记事本”。创建新文件,并按创建新文件,并按创建新文件,并按创建新文件,并按HTMLHTML语言规则编辑。在语言规则编辑。在语言规则编辑。在语言规则编辑。在“记事本记事本记事本记事本”窗口中输入窗口中输入窗口中输入窗口中输入HTMLHTML语言,输入的内容。语言,输入的内容。语言,输入的内容。语言,输入的内容。保存网页。打开保存网页。打开保存网页。打开保存网页。打开“记事本记事本记事本记事本”的的的的“文件文件文件文件”菜单,选择菜单,选择菜单,选择菜单,选择“保存保存保存保存”。此时
24、将出现。此时将出现。此时将出现。此时将出现“另存为另存为另存为另存为”对话框,在对话框,在对话框,在对话框,在“保存在保存在保存在保存在”下下下下拉列表框中选择文件要存放的路径;在拉列表框中选择文件要存放的路径;在拉列表框中选择文件要存放的路径;在拉列表框中选择文件要存放的路径;在“文件名文件名文件名文件名”文本框输文本框输文本框输文本框输入以入以入以入以.html.html或或或或.htm.htm为后缀的文件名,如为后缀的文件名,如为后缀的文件名,如为后缀的文件名,如welcome.htmlwelcome.html;在;在;在;在“保存类型保存类型保存类型保存类型”下拉列表框中选择下拉列表框
25、中选择下拉列表框中选择下拉列表框中选择“文本文档文本文档文本文档文本文档”。最后单击。最后单击。最后单击。最后单击“保存保存保存保存”按钮,将记事本中的内容保存在磁盘中。按钮,将记事本中的内容保存在磁盘中。按钮,将记事本中的内容保存在磁盘中。按钮,将记事本中的内容保存在磁盘中。如果希望这一页是网站的首页(主页),想让浏览者输如果希望这一页是网站的首页(主页),想让浏览者输如果希望这一页是网站的首页(主页),想让浏览者输如果希望这一页是网站的首页(主页),想让浏览者输入网址后,就显示这一页的内容,可以把这个文件设为默认入网址后,就显示这一页的内容,可以把这个文件设为默认入网址后,就显示这一页的内
26、容,可以把这个文件设为默认入网址后,就显示这一页的内容,可以把这个文件设为默认文档,文件名为文档,文件名为文档,文件名为文档,文件名为index.htmlindex.html或或或或index.htmindex.htm。4.3 4.3 网页文件的创建过程网页文件的创建过程网页文件的创建过程网页文件的创建过程 4.3.1 4.3.1 编辑和保存网页编辑和保存网页编辑和保存网页编辑和保存网页 1.1.用浏览器打开用浏览器打开用浏览器打开用浏览器打开 2.2.在在在在“Windows“Windows资源管理器资源管理器资源管理器资源管理器”或或或或“我的电脑我的电脑我的电脑我的电脑”中打开中打开中打
27、开中打开 在在在在“Windows“Windows资源管理器资源管理器资源管理器资源管理器”或或或或“我的电脑我的电脑我的电脑我的电脑”中双击要打中双击要打中双击要打中双击要打开的开的开的开的.html.html文件,这时将直接在默认的浏览器中打开该文件,这时将直接在默认的浏览器中打开该文件,这时将直接在默认的浏览器中打开该文件,这时将直接在默认的浏览器中打开该.html.html文件。文件。文件。文件。4.3 4.3 网页文件的创建过程网页文件的创建过程网页文件的创建过程网页文件的创建过程 4.3.2 4.3.2 预览网页预览网页预览网页预览网页 !-2 2 强制换行和不换行标记强制换行和不
28、换行标记强制换行和不换行标记强制换行和不换行标记、.放在一行的末尾,可以使后面的文字、图片、表格等显放在一行的末尾,可以使后面的文字、图片、表格等显放在一行的末尾,可以使后面的文字、图片、表格等显放在一行的末尾,可以使后面的文字、图片、表格等显示于下一行,而又不会在行与行之间留下空行,即强制文本换示于下一行,而又不会在行与行之间留下空行,即强制文本换示于下一行,而又不会在行与行之间留下空行,即强制文本换示于下一行,而又不会在行与行之间留下空行,即强制文本换行。强制换行标记的格式为:行。强制换行标记的格式为:行。强制换行标记的格式为:行。强制换行标记的格式为:文字文字 不换行标记可令文字不能因太
29、长使浏览器无法显示而换行,不换行标记可令文字不能因太长使浏览器无法显示而换行,不换行标记可令文字不能因太长使浏览器无法显示而换行,不换行标记可令文字不能因太长使浏览器无法显示而换行,它对住址、数学公式、一行数字等尤其有用。其格式为:它对住址、数学公式、一行数字等尤其有用。其格式为:它对住址、数学公式、一行数字等尤其有用。其格式为:它对住址、数学公式、一行数字等尤其有用。其格式为:文字文字 4.4 4.4 段落标记段落标记段落标记段落标记 1 1 注释标记注释标记注释标记注释标记 段落标记放在一个段落的头尾,用于定义一个段落。段落标记放在一个段落的头尾,用于定义一个段落。段落标记放在一个段落的头
30、尾,用于定义一个段落。段落标记放在一个段落的头尾,用于定义一个段落。.标记不但能使后面的文字换到下一行,还可标记不但能使后面的文字换到下一行,还可标记不但能使后面的文字换到下一行,还可标记不但能使后面的文字换到下一行,还可以使两段之间多一空行。段落标记的格式为:以使两段之间多一空行。段落标记的格式为:以使两段之间多一空行。段落标记的格式为:以使两段之间多一空行。段落标记的格式为:文字文字文字文字 一个段落标记一个段落标记一个段落标记一个段落标记可以看作是两个可以看作是两个可以看作是两个可以看作是两个标记,即标记,即标记,即标记,即。4.4 4.4 段落标记段落标记段落标记段落标记 3 3 段落
31、标记段落标记段落标记段落标记.设定文字、图像、表格的摆放位置。当在许多段落中设定文字、图像、表格的摆放位置。当在许多段落中设定文字、图像、表格的摆放位置。当在许多段落中设定文字、图像、表格的摆放位置。当在许多段落中设置对齐方式时,常使用设置对齐方式时,常使用设置对齐方式时,常使用设置对齐方式时,常使用标记。定位标记标记。定位标记标记。定位标记标记。定位标记的格式为:的格式为:的格式为:的格式为:文本、图像或表文本、图像或表文本、图像或表文本、图像或表格格格格 缺省时默认为缺省时默认为缺省时默认为缺省时默认为leftleft。4.4 4.4 段落标记段落标记段落标记段落标记 4 4 定位标记定位
32、标记定位标记定位标记 当浏览器解释到当浏览器解释到当浏览器解释到当浏览器解释到HTMLHTML文档中的文档中的文档中的文档中的标记时,会在此处标记时,会在此处标记时,会在此处标记时,会在此处换行,并加入一条水平线段。换行,并加入一条水平线段。换行,并加入一条水平线段。换行,并加入一条水平线段。水平线标记的格式为:水平线标记的格式为:水平线标记的格式为:水平线标记的格式为:hr align=left|center|right size=/sizesize设定线条粗细,以像素为单位,默认为设定线条粗细,以像素为单位,默认为设定线条粗细,以像素为单位,默认为设定线条粗细,以像素为单位,默认为2 2。
33、width width设定线段长度,可以是绝对值(以像素为单位)设定线段长度,可以是绝对值(以像素为单位)设定线段长度,可以是绝对值(以像素为单位)设定线段长度,可以是绝对值(以像素为单位)或相对值(相对于当前窗口的百分比)。或相对值(相对于当前窗口的百分比)。或相对值(相对于当前窗口的百分比)。或相对值(相对于当前窗口的百分比)。colorcolor设定线条色彩,默认为黑色。可以采用色彩的名设定线条色彩,默认为黑色。可以采用色彩的名设定线条色彩,默认为黑色。可以采用色彩的名设定线条色彩,默认为黑色。可以采用色彩的名称。色彩可以用相应英文单词或以称。色彩可以用相应英文单词或以称。色彩可以用相应
34、英文单词或以称。色彩可以用相应英文单词或以“#”“#”引导的一个十六进引导的一个十六进引导的一个十六进引导的一个十六进制数代码来表示。制数代码来表示。制数代码来表示。制数代码来表示。4.4 4.4 段落标记段落标记段落标记段落标记 5 5 水平线标记水平线标记水平线标记水平线标记 【例【例【例【例4-24-2】本例文件】本例文件】本例文件】本例文件ex4-2.htmex4-2.htm在浏览器中的显示效果如图在浏览器中的显示效果如图在浏览器中的显示效果如图在浏览器中的显示效果如图4-44-4所示。所示。所示。所示。4.4 4.4 段落标记段落标记段落标记段落标记 6 6段落标记综合实例段落标记综
35、合实例段落标记综合实例段落标记综合实例图4-4 段落标记综合实例【例4-2】标题文字标题文字标题文字标题文字 l l#用来指定标题文字的大小,用来指定标题文字的大小,用来指定标题文字的大小,用来指定标题文字的大小,#取取取取1 16 6的整数值,取的整数值,取的整数值,取的整数值,取1 1时时时时文字最大,文字最大,文字最大,文字最大,6 6时文字最小。时文字最小。时文字最小。时文字最小。l l 属性属性属性属性alignalign设置标题在页面中的对齐方式:设置标题在页面中的对齐方式:设置标题在页面中的对齐方式:设置标题在页面中的对齐方式:leftleft、centercenter或或或或r
36、ightright。缺省时默认为。缺省时默认为。缺省时默认为。缺省时默认为leftleft。l l 标记缺省显示宋体,在一个标题行中标记缺省显示宋体,在一个标题行中标记缺省显示宋体,在一个标题行中标记缺省显示宋体,在一个标题行中无法使用不同大小的字体。无法使用不同大小的字体。无法使用不同大小的字体。无法使用不同大小的字体。l l 与用与用与用与用定义的网页标题不同,标题格定义的网页标题不同,标题格定义的网页标题不同,标题格定义的网页标题不同,标题格式显示在浏览器窗口内,而不显示在浏览器的标题栏中。式显示在浏览器窗口内,而不显示在浏览器的标题栏中。式显示在浏览器窗口内,而不显示在浏览器的标题栏中
37、。式显示在浏览器窗口内,而不显示在浏览器的标题栏中。4.5 4.5 文字标记文字标记文字标记文字标记 1 1 标题文字标记标题文字标记标题文字标记标题文字标记 【例【例【例【例4-34-3】设置文字的标题。本例文件】设置文字的标题。本例文件】设置文字的标题。本例文件】设置文字的标题。本例文件ex4-3.htmex4-3.htm在浏览在浏览在浏览在浏览器中的显示效果如图器中的显示效果如图器中的显示效果如图器中的显示效果如图4-54-5所示。所示。所示。所示。4.5 4.5 文字标记文字标记文字标记文字标记 2 2文字标记实例文字标记实例文字标记实例文字标记实例图4-5 文字标记综合实例【例4-3
38、】l l 超链接从当前网页定义的位置跳转到其他位置,包括当前超链接从当前网页定义的位置跳转到其他位置,包括当前超链接从当前网页定义的位置跳转到其他位置,包括当前超链接从当前网页定义的位置跳转到其他位置,包括当前页的某个位置、页的某个位置、页的某个位置、页的某个位置、InternetInternet或本地硬盘或局域网上的其他文或本地硬盘或局域网上的其他文或本地硬盘或局域网上的其他文或本地硬盘或局域网上的其他文件,甚至跳转到声音、图片等多媒体文件。件,甚至跳转到声音、图片等多媒体文件。件,甚至跳转到声音、图片等多媒体文件。件,甚至跳转到声音、图片等多媒体文件。l l 通过超链接还可以获得不同形态的
39、服务,如文件传输、资通过超链接还可以获得不同形态的服务,如文件传输、资通过超链接还可以获得不同形态的服务,如文件传输、资通过超链接还可以获得不同形态的服务,如文件传输、资料查询、电子邮件、远程访问等。料查询、电子邮件、远程访问等。料查询、电子邮件、远程访问等。料查询、电子邮件、远程访问等。l l 当网页包含超链接时,网页中的外观形式为彩色(一般为当网页包含超链接时,网页中的外观形式为彩色(一般为当网页包含超链接时,网页中的外观形式为彩色(一般为当网页包含超链接时,网页中的外观形式为彩色(一般为蓝色)且带下划线的文字或图片。单击这些文本或图片,可蓝色)且带下划线的文字或图片。单击这些文本或图片,
40、可蓝色)且带下划线的文字或图片。单击这些文本或图片,可蓝色)且带下划线的文字或图片。单击这些文本或图片,可跳转到相应位置。跳转到相应位置。跳转到相应位置。跳转到相应位置。l l 超文本链接使用锚点标记超文本链接使用锚点标记超文本链接使用锚点标记超文本链接使用锚点标记来定义。来定义。来定义。来定义。4.6 4.6 超链接超链接超链接超链接 l 锚点(锚点(锚点(锚点(anchoranchor)标记由)标记由)标记由)标记由定义,它在网页上建立超文定义,它在网页上建立超文定义,它在网页上建立超文定义,它在网页上建立超文本链接。本链接。本链接。本链接。l l 通过单击一个词、句或图片,可从此处转到另
41、一个链接通过单击一个词、句或图片,可从此处转到另一个链接通过单击一个词、句或图片,可从此处转到另一个链接通过单击一个词、句或图片,可从此处转到另一个链接资源(目标资源),这个目标资源有惟一的资源(目标资源),这个目标资源有惟一的资源(目标资源),这个目标资源有惟一的资源(目标资源),这个目标资源有惟一的URLURL。具有以。具有以。具有以。具有以上特点的词、句或图片就称为热点。上特点的词、句或图片就称为热点。上特点的词、句或图片就称为热点。上特点的词、句或图片就称为热点。标记的格式为:标记的格式为:标记的格式为:标记的格式为:a href=URL target=热点热点热点热点 l l hre
42、f href属性为超文本引用,它的值为一个属性为超文本引用,它的值为一个属性为超文本引用,它的值为一个属性为超文本引用,它的值为一个URLURL,是目标,是目标,是目标,是目标资源的有效地址。资源的有效地址。资源的有效地址。资源的有效地址。l l 如果要创建一个不链接到其他位置的空超链接,可用如果要创建一个不链接到其他位置的空超链接,可用如果要创建一个不链接到其他位置的空超链接,可用如果要创建一个不链接到其他位置的空超链接,可用“#”“#”代替代替代替代替URLURL,即,即,即,即 热点热点热点热点 。4.6 4.6 超链接超链接超链接超链接 1 1 锚点标记锚点标记锚点标记锚点标记.tar
43、get属性属性targettarget设定链接被单击后结果所要开始窗口的方设定链接被单击后结果所要开始窗口的方设定链接被单击后结果所要开始窗口的方设定链接被单击后结果所要开始窗口的方式。可选值为:式。可选值为:式。可选值为:式。可选值为:_blank_blank,_parent_parent,_self_self,_top_top。l_blank:空白视窗,保留原来的窗口,新开启一个窗口浏览所链接的文件内容;l_parent:上一层页框视窗,若网页使用框架,则所链接的网页回到上一层的框架所在窗口;l_self:本身视窗,默认链接显示方式,所链接的内容取代原来窗口的内容;l_top:全视窗,以全
44、窗口的方式出现所链接的网页,取代所有窗口内容。(1)(1)链接到同一目录内的网页文件链接到同一目录内的网页文件链接到同一目录内的网页文件链接到同一目录内的网页文件 链接到同一目录内的网页文件的格式为:链接到同一目录内的网页文件的格式为:链接到同一目录内的网页文件的格式为:链接到同一目录内的网页文件的格式为:a href=.html 热点文本热点文本热点文本热点文本 (2)(2)链接到下一级目录中的网页文件链接到下一级目录中的网页文件链接到下一级目录中的网页文件链接到下一级目录中的网页文件 链接到下一级目录中网页文件的格式为:链接到下一级目录中网页文件的格式为:链接到下一级目录中网页文件的格式为
45、:链接到下一级目录中网页文件的格式为:a href=.html 热点文本热点文本热点文本热点文本 (3)(3)链接到上一级目录中的网页文件链接到上一级目录中的网页文件链接到上一级目录中的网页文件链接到上一级目录中的网页文件 链接到上一级目录中网页文件的格式为:链接到上一级目录中网页文件的格式为:链接到上一级目录中网页文件的格式为:链接到上一级目录中网页文件的格式为:a href=./.html 热点文本热点文本热点文本热点文本 其中其中其中其中“./“./表示退到上一级目录中。表示退到上一级目录中。表示退到上一级目录中。表示退到上一级目录中。(4)(4)链接到同级目录中的网页文件链接到同级目录
46、中的网页文件链接到同级目录中的网页文件链接到同级目录中的网页文件 链接到同级目录中网页文件的格式为:链接到同级目录中网页文件的格式为:链接到同级目录中网页文件的格式为:链接到同级目录中网页文件的格式为:a href=./.html 热点文本热点文本热点文本热点文本 4.6 4.6 超链接超链接超链接超链接 2 2 指向其他页面的链接指向其他页面的链接指向其他页面的链接指向其他页面的链接 要在当前页面内实现超链接,需要定义两个标记:一个为要在当前页面内实现超链接,需要定义两个标记:一个为要在当前页面内实现超链接,需要定义两个标记:一个为要在当前页面内实现超链接,需要定义两个标记:一个为超链接标记
47、,另一个为书签标记。超链接标记的格式为:超链接标记,另一个为书签标记。超链接标记的格式为:超链接标记,另一个为书签标记。超链接标记的格式为:超链接标记,另一个为书签标记。超链接标记的格式为:a href=#热点文本热点文本热点文本热点文本 书签就是用书签就是用书签就是用书签就是用标记对该文本作一个记号。格式为:标记对该文本作一个记号。格式为:标记对该文本作一个记号。格式为:标记对该文本作一个记号。格式为:a name=目标文本附近的字符串目标文本附近的字符串目标文本附近的字符串目标文本附近的字符串 4.6 4.6 超链接超链接超链接超链接 3 3 指向本页中的链接指向本页中的链接指向本页中的链
48、接指向本页中的链接建立指向其他页面某处的文本建立指向其他页面某处的文本n n格式为:格式为:格式为:格式为:n n a href=URL#热点文本热点文本热点文本热点文本 n n要在跳转到的位置处加上链接标记:要在跳转到的位置处加上链接标记:要在跳转到的位置处加上链接标记:要在跳转到的位置处加上链接标记:n n a name=文字串文字串文字串文字串 n n如果链接指向其他文件的某一部分,格式为:如果链接指向其他文件的某一部分,格式为:如果链接指向其他文件的某一部分,格式为:如果链接指向其他文件的某一部分,格式为:n n a href=热热热热点文本点文本点文本点文本 如果链接到的文件不是如果
49、链接到的文件不是如果链接到的文件不是如果链接到的文件不是HTMLHTML文件,则该文件将作为下载文件,则该文件将作为下载文件,则该文件将作为下载文件,则该文件将作为下载文件,其格式为:文件,其格式为:文件,其格式为:文件,其格式为:a href=热点文本热点文本热点文本热点文本 5 5 指向电子邮件的链接指向电子邮件的链接指向电子邮件的链接指向电子邮件的链接 单击指向电子邮件的链接,将打开缺省的电子邮件程序,单击指向电子邮件的链接,将打开缺省的电子邮件程序,单击指向电子邮件的链接,将打开缺省的电子邮件程序,单击指向电子邮件的链接,将打开缺省的电子邮件程序,如如如如FoxMailFoxMail、
50、Outlook ExpressOutlook Express,并自动填写邮件地址。指向,并自动填写邮件地址。指向,并自动填写邮件地址。指向,并自动填写邮件地址。指向电子邮件链接的格式为:电子邮件链接的格式为:电子邮件链接的格式为:电子邮件链接的格式为:热点文本热点文本 4.6 4.6 超链接超链接超链接超链接 4 4 指向下载文件的链接指向下载文件的链接指向下载文件的链接指向下载文件的链接 【例【例【例【例4-44-4】超链接综合实例。在浏览器中的显示效果如图】超链接综合实例。在浏览器中的显示效果如图】超链接综合实例。在浏览器中的显示效果如图】超链接综合实例。在浏览器中的显示效果如图4-64-