《第2章超文本标记语言HTML.ppt》由会员分享,可在线阅读,更多相关《第2章超文本标记语言HTML.ppt(73页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、1第第2章章 超文本标记语言超文本标记语言HTML 本章内容本章内容 第第第第1 1 1 1节节节节 HTMLHTMLHTMLHTML语言基础语言基础语言基础语言基础第第第第2 2 2 2节节节节 HTMLHTMLHTMLHTML文档首部与文档体文档首部与文档体文档首部与文档体文档首部与文档体第第第第3 3 3 3节节节节 文本的格式化文本的格式化文本的格式化文本的格式化第第第第4 4 4 4节节节节 超链接和列表超链接和列表超链接和列表超链接和列表第第第第5 5 5 5节节节节 图像图像图像图像和多媒体和多媒体和多媒体和多媒体元素元素元素元素第第第第6 6 6 6节节节节 表表表表 格格格格
2、 第第第第7 7 7 7节节节节 表表表表 单单单单第第第第8 8 8 8节节节节 框框框框 架架架架2一、一、HTMLHTML概述概述 HTMLHTML即即超文本超文本标识语标识语言言的的缩缩写写,自自19901990年年问问世世后,到目前后,到目前为为止已止已经经到第四版,到第四版,现现在的在的HTML 4.01HTML 4.01和初出世的和初出世的HTMLHTML有天壤之有天壤之别别,它已能在,它已能在WebWeb页页面上面上随心所欲地放置随心所欲地放置图图片和文字,在片和文字,在JavaScriptJavaScript,VBScriptVBScript的的辅辅助下助下还还具有具有动态动
3、态互互动动能力。能力。HTMLHTML语语言作言作为为一种一种“标标志志”语语言言。它。它通通过夹过夹在两在两个尖括号之个尖括号之间间的的标标志字符串来控制文本、志字符串来控制文本、图图像的像的显显示方式及加于其上的示方式及加于其上的动动作。作。第第1节节HTML语言基础语言基础3 二、二、HTMLHTML的基本结构的基本结构 1 1、HTMLHTML的元素与标签的元素与标签 HTMLHTML文文档档是是由由元元素素和和内内容容组组成成的的。其其中中,元元素素(Element)(Element)就就是是HTMLHTML语语言言中中尖尖括括号号之间的标记,又叫标签之间的标记,又叫标签(Tag)(
4、Tag)。元元素素分分为为两两大大类类:一一类类用用于于确确定定超超文文本本在在浏浏览览器器中中显显示示的的方方式式;另另一一类类用用于于确确定定超超文文本本在在浏浏览览器器中中显显示示的的内内容容。元元素素在在文文本本中中具具有如下格式:有如下格式:内容内容/第第1节节HTML语言基础语言基础4注意注意 :1.1.每个元素都用每个元素都用“”括起来,括起来,“”与元素名与元素名之间之间不能有空格或其它字符不能有空格或其它字符。2.2.所有的元素都是所有的元素都是成对出现成对出现的,在元素名前加符号的,在元素名前加符号“/”便是其结束标记,表示这种元素内容的结束。便是其结束标记,表示这种元素内
5、容的结束。3.3.元素名元素名不用区分大小写不用区分大小写。但在编写网页时最好保持。但在编写网页时最好保持元素的大小写一致,这样便于辨认,有利于减少编元素的大小写一致,这样便于辨认,有利于减少编制网页中的错误。制网页中的错误。4.4.对同一段要标记的内容,可以对同一段要标记的内容,可以用多个元素来共同作用多个元素来共同作用用,产生一定的效果。此时各个元素间的顺序也是,产生一定的效果。此时各个元素间的顺序也是任意的。任意的。第第1节节HTML语言基础语言基础55.5.另另外外还还有有一一种种元元素素,不不对对文文档档中中的的某某个个部部分分起起作作用用,只是用来提供给浏览器一种显示方式,只是用来
6、提供给浏览器一种显示方式,如如就显示一条水平线就显示一条水平线。6.6.还还有有一一些些元元素素具具有有参参数数(Parameter)(Parameter),这这些些参参数数一一般般精精确确地地确确定定这这种种元元素素的的显显示示方方式式,被被称称为为该该元元素素的的属属性性(Properties)(Properties)。元元素素的的属属性性的的取取值值(Value)(Value)一一般般用用双引号括起来双引号括起来,格式:,格式:内容内容/例如例如h1 align=一一级标题级标题/hl 第第1节节HTML语言基础语言基础6第第1节节HTML语言基础语言基础7.HTML7.HTML7.HT
7、ML7.HTML标记标记标记标记可以嵌套,但不可交叉可以嵌套,但不可交叉可以嵌套,但不可交叉可以嵌套,但不可交叉。例如:例如:例如:例如:奥林匹克奥林匹克奥林匹克奥林匹克将不能正确显将不能正确显将不能正确显将不能正确显示。示。示。示。8.HTML8.HTML8.HTML8.HTML文件文件文件文件一行可以写多个标记,一个标记也可以分一行可以写多个标记,一个标记也可以分一行可以写多个标记,一个标记也可以分一行可以写多个标记,一个标记也可以分多行书写,不用任何续行符号多行书写,不用任何续行符号多行书写,不用任何续行符号多行书写,不用任何续行符号。例如:例如:例如:例如:font face=font
8、 face=font face=2001200120012001年年年年7 7 7 7月月月月13131313日,北京申奥成功日,北京申奥成功日,北京申奥成功日,北京申奥成功!但但但但HTMLHTMLHTMLHTML标记中的一个单词不能分两行书写标记中的一个单词不能分两行书写标记中的一个单词不能分两行书写标记中的一个单词不能分两行书写,如:,如:,如:,如:fofofo _GB2312 _GB2312 _GB2312 2001200120012001年年年年7 7 7 7月月月月13131313日,北京申奥成功!日,北京申奥成功!日,北京申奥成功!日,北京申奥成功!是不正确的。是不正确的。是不
9、正确的。是不正确的。72、HTML文档的结构文档的结构 HTMLHTML文档的基本结构为:文档的基本结构为:文档的基本结构为:文档的基本结构为:网页标题网页标题网页标题网页标题 网页内容网页内容网页内容网页内容第第1节节HTML语言基础语言基础83 3、HTMLHTML文档的命名文档的命名文档的命名文档的命名当一个当一个当一个当一个WebWebWebWeb浏览器打开一个文件时,首先确定该文件浏览器打开一个文件时,首先确定该文件浏览器打开一个文件时,首先确定该文件浏览器打开一个文件时,首先确定该文件的类型,然后再确定其打开方式。文件的后缀名就的类型,然后再确定其打开方式。文件的后缀名就的类型,然
10、后再确定其打开方式。文件的后缀名就的类型,然后再确定其打开方式。文件的后缀名就成为文件类型的标志。成为文件类型的标志。成为文件类型的标志。成为文件类型的标志。HTMLHTMLHTMLHTML文档本身是一种文档本身是一种文档本身是一种文档本身是一种文本文件文本文件文本文件文本文件,它的文件扩展名通常,它的文件扩展名通常,它的文件扩展名通常,它的文件扩展名通常为为为为“.html.html.html.html”和和和和“.htmhtmhtmhtm”标志,所以只要有标志,所以只要有标志,所以只要有标志,所以只要有文字文字文字文字编辑功能的工具编辑功能的工具编辑功能的工具编辑功能的工具都可以用来编辑或
11、处理都可以用来编辑或处理都可以用来编辑或处理都可以用来编辑或处理HTMLHTMLHTMLHTML文件。文件。文件。文件。第第1节节HTML语言基础语言基础9 4 4、HTMLHTML的注释的注释的注释的注释 WebWeb浏览器对浏览器对浏览器对浏览器对“!-”之间的部分不予显示。之间的部分不予显示。之间的部分不予显示。之间的部分不予显示。一个优秀的网页应该有详尽的注释,能让别人看得一个优秀的网页应该有详尽的注释,能让别人看得一个优秀的网页应该有详尽的注释,能让别人看得一个优秀的网页应该有详尽的注释,能让别人看得懂页面源代码。懂页面源代码。懂页面源代码。懂页面源代码。HTMLHTML的注释的功能
12、的注释的功能的注释的功能的注释的功能除了注释外除了注释外除了注释外除了注释外,还能用作屏蔽功还能用作屏蔽功还能用作屏蔽功还能用作屏蔽功能能能能。网页制作者常利用。网页制作者常利用。网页制作者常利用。网页制作者常利用来屏蔽掉不想让来屏蔽掉不想让来屏蔽掉不想让来屏蔽掉不想让页面访问者看到但又必须放到网页里的部分,页面访问者看到但又必须放到网页里的部分,页面访问者看到但又必须放到网页里的部分,页面访问者看到但又必须放到网页里的部分,如嵌如嵌如嵌如嵌入到网页中的脚本,样式表等。入到网页中的脚本,样式表等。入到网页中的脚本,样式表等。入到网页中的脚本,样式表等。第第1节节HTML语言基础语言基础10第第
13、2节节HTML文档首部与文档体文档首部与文档体 HTMLHTML文档首部一般用于标记文档的某些信息,文档首部一般用于标记文档的某些信息,放于文档的放于文档的与与之间,用于描述之间,用于描述HTMLHTML文文档的信息,如档的信息,如文件的标题、搜索引擎可用的关键词、文件的标题、搜索引擎可用的关键词、作者及网页描述信息、作者及网页描述信息、CSSCSS样式表的定义与引用样式表的定义与引用等,等,它们通常不会显示在页面上。它们通常不会显示在页面上。文档体用文档体用和和标记。网页正文中标记。网页正文中的所有内容(包括相应的格式化标记)都包含在这的所有内容(包括相应的格式化标记)都包含在这个标记之间,
14、包括文字、表格、图像、声音、动画个标记之间,包括文字、表格、图像、声音、动画等等。等等。111 1 1 1、网页标题、网页标题、网页标题、网页标题 其用法为:其用法为:其用法为:其用法为:网页的标题网页的标题网页的标题网页的标题 该该该该 元元元元 素素素素 用用用用 于于于于 标标标标 记记记记 文文文文 档档档档 的的的的 标标标标 题题题题,通通通通 常常常常之之之之间间间间的的的的文文文文字字字字会会会会显显显显示示示示在在在在浏浏浏浏览览览览器器器器的的的的标标标标题题题题栏栏栏栏上上上上。一一一一般般般般用用用用简简简简明明明明扼扼扼扼要要要要的的的的文文文文字字字字概概概概括括括
15、括该该该该文文文文档档档档的的的的主主主主题题题题,不不不不超超超超过过过过64646464个个个个ACSIIACSIIACSIIACSII码码码码字字字字符符符符长长长长度度度度。因因因因为为为为过长的话,窗口的标题栏无法容纳。过长的话,窗口的标题栏无法容纳。过长的话,窗口的标题栏无法容纳。过长的话,窗口的标题栏无法容纳。第第2节节HTML文档首部与文档体文档首部与文档体12 2 2、isindexisindex 该标签用于标志该文档为索引文件,即该文档可以使用该标签用于标志该文档为索引文件,即该文档可以使用该标签用于标志该文档为索引文件,即该文档可以使用该标签用于标志该文档为索引文件,即该
16、文档可以使用关键字查询,该文档所在的服务器一定有用于该文档的搜索关键字查询,该文档所在的服务器一定有用于该文档的搜索关键字查询,该文档所在的服务器一定有用于该文档的搜索关键字查询,该文档所在的服务器一定有用于该文档的搜索引擎。其用法为:引擎。其用法为:引擎。其用法为:引擎。其用法为:isindex 3 3、basebase 该该该该标标标标签签签签用用用用于于于于记记记记录录录录文文文文档档档档本本本本身身身身的的的的统统统统一一一一资资资资源源源源地地地地址址址址(URL)(URL),不不不不能能能能含含含含有有有有文文文文件件件件的的的的名名名名称称称称;这这这这在在在在文文文文档档档档从
17、从从从原原原原来来来来的的的的位位位位置置置置移移移移到到到到其其其其他他他他地地地地方方方方后后后后特特特特别别别别有用。其用法为:有用。其用法为:有用。其用法为:有用。其用法为:base 4 4、linklink 该该该该标标标标签签签签用用用用于于于于标标标标志志志志某某某某一一一一文文文文档档档档和和和和其其其其他他他他文文文文档档档档或或或或者者者者对对对对象象象象之之之之间间间间的的的的相相相相互互互互关关关关系系系系。可可可可能能能能出出出出现现现现的的的的关关关关系系系系有有有有:“NEXTNEXT”、“PREVIOUSPREVIOUS”和和和和“HOMEHOME”等。其等。其
18、等。其等。其用法为:用法为:用法为:用法为:link 第第2节节HTML文档首部与文档体文档首部与文档体13 5 5 5 5、metametametameta 该该该该标标标标签签签签用用用用于于于于为为为为文文文文档档档档的的的的特特特特殊殊殊殊变变变变量量量量赋赋赋赋值值值值,提提提提供供供供关关关关于于于于文文文文档档档档的的的的信信信信息息息息,比比比比如如如如设设设设置置置置浏浏浏浏览览览览器器器器所所所所使使使使用用用用的的的的语语语语言言言言、创创创创建建建建日日日日期期期期、作作作作者者者者或或或或者者者者版版版版权权权权信信信信息息息息。这这这这些些些些变变变变量量量量将将将
19、将被被被被加加加加到到到到由由由由WebWebWebWeb服服服服务务务务器器器器发发发发送送送送到到到到被被被被浏浏浏浏览览览览器器器器使使使使用用用用的的的的相相相相关关关关的的的的域域域域中中中中。其其其其用用用用法:法:法:法:meta name=meta name=meta name=常用的有以下几种:常用的有以下几种:常用的有以下几种:常用的有以下几种:(1 1 1 1)指定被搜索引擎作为索引的关键词。)指定被搜索引擎作为索引的关键词。)指定被搜索引擎作为索引的关键词。)指定被搜索引擎作为索引的关键词。用法:用法:用法:用法:meta meta meta 第第2节节HTML文档首部
20、与文档体文档首部与文档体14(2 2 2 2)设置文档的语言字符集信息)设置文档的语言字符集信息)设置文档的语言字符集信息)设置文档的语言字符集信息该标签用于向这个文档提示它所使用的语言。该标签用于向这个文档提示它所使用的语言。该标签用于向这个文档提示它所使用的语言。该标签用于向这个文档提示它所使用的语言。用法:用法:用法:用法:meta http-equiv=Content-Type meta http-equiv=Content-Type meta http-equiv=Content-Type content=text/html;charset=gb2312content=text/ht
21、ml;charset=gb2312content=text/html;charset=gb2312 (3 3 3 3)自动刷新页面)自动刷新页面)自动刷新页面)自动刷新页面该该该该标标标标签签签签能能能能够够够够要要要要求求求求浏浏浏浏览览览览器器器器以以以以设设设设置置置置的的的的时时时时间间间间为为为为周周周周期期期期自自自自动动动动更更更更新新新新文文文文档,档,档,档,用法:用法:用法:用法:meta http-equiv=refresh meta http-equiv=refresh meta http-equiv=refresh content=seconds;URL=linkto
22、content=seconds;URL=linktocontent=seconds;URL=linkto (4 4 4 4)描述页面内容)描述页面内容)描述页面内容)描述页面内容该该该该标标标标签签签签向向向向浏浏浏浏览览览览器器器器报报报报告告告告页页页页面面面面的的的的相相相相关关关关信信信信息息息息如如如如作作作作者者者者、版版版版权权权权等等等等。用法:用法:用法:用法:第第2节节HTML文档首部与文档体文档首部与文档体15n n6.6.6.6.文档体标记文档体标记文档体标记文档体标记n n功能:功能:功能:功能:设置文件主体。设置文件主体。设置文件主体。设置文件主体。n n格式:格式
23、:格式:格式:=value=value=value n nn n。n n属性:属性:属性:属性:n nbackgroundbackgroundbackgroundbackground 设置网页背景图像;设置网页背景图像;设置网页背景图像;设置网页背景图像;n nbgcolorbgcolorbgcolorbgcolor 设置网页背景颜色,默认为白色;设置网页背景颜色,默认为白色;设置网页背景颜色,默认为白色;设置网页背景颜色,默认为白色;n nTextTextTextText 设置网页非可链接文字的色彩,默认为黑色;设置网页非可链接文字的色彩,默认为黑色;设置网页非可链接文字的色彩,默认为黑色;
24、设置网页非可链接文字的色彩,默认为黑色;n nLink Link Link Link 设置网页可链接文字的色彩设置网页可链接文字的色彩设置网页可链接文字的色彩设置网页可链接文字的色彩 ,默认为蓝色;,默认为蓝色;,默认为蓝色;,默认为蓝色;第第2节节HTML文档首部与文档体文档首部与文档体16第第2节节HTML文档首部与文档体文档首部与文档体n nAlinkAlinkAlinkAlink 设置网页正被单击的可链接文字的色彩,默认为蓝色设置网页正被单击的可链接文字的色彩,默认为蓝色设置网页正被单击的可链接文字的色彩,默认为蓝色设置网页正被单击的可链接文字的色彩,默认为蓝色n nVlinkVlin
25、kVlinkVlink 设置网页已经单击设置网页已经单击设置网页已经单击设置网页已经单击(访问访问访问访问)过的可链接文字的色彩,默过的可链接文字的色彩,默过的可链接文字的色彩,默过的可链接文字的色彩,默认为蓝色;认为蓝色;认为蓝色;认为蓝色;n nLeftmarginLeftmarginLeftmarginLeftmargin 设置页面左边空白;设置页面左边空白;设置页面左边空白;设置页面左边空白;n nTopmarginTopmarginTopmarginTopmargin 设置页面上面空白;设置页面上面空白;设置页面上面空白;设置页面上面空白;n nColor Color Color C
26、olor 颜色值,颜色值,颜色值,颜色值,可以是颜色代码可以是颜色代码可以是颜色代码可以是颜色代码,如:,如:,如:,如:RED(RED(RED(RED(红红红红)、GREENGREENGREENGREEN(绿)、(绿)、(绿)、(绿)、BLUEBLUEBLUEBLUE(蓝)、(蓝)、(蓝)、(蓝)、YELLOWYELLOWYELLOWYELLOW(黄)、(黄)、(黄)、(黄)、WHITEWHITEWHITEWHITE(白)、(白)、(白)、(白)、BLACKBLACKBLACKBLACK(黑)等。(黑)等。(黑)等。(黑)等。也可以是也可以是也可以是也可以是#加加加加6 6 6 6位十六进制
27、数位十六进制数位十六进制数位十六进制数,如,如,如,如#000000#000000#000000#000000(黑)、(黑)、(黑)、(黑)、#0000FF#0000FF#0000FF#0000FF(蓝)、(蓝)、(蓝)、(蓝)、#FFFFFF#FFFFFF#FFFFFF#FFFFFF(白)、(白)、(白)、(白)、#FF0000#FF0000#FF0000#FF0000(红)等;(红)等;(红)等;(红)等;也可是十也可是十也可是十也可是十进制表示进制表示进制表示进制表示,如,如,如,如rgb(0,0,0)rgb(0,0,0)rgb(0,0,0)rgb(0,0,0)(黑)、(黑)、(黑)、(
28、黑)、rgb(255,0,0)rgb(255,0,0)rgb(255,0,0)rgb(255,0,0)红)等。红)等。红)等。红)等。n nValueValue 空白量,可以是空白量,可以是空白量,可以是空白量,可以是数值数值数值数值,也可以是相对页面窗口宽度和,也可以是相对页面窗口宽度和,也可以是相对页面窗口宽度和,也可以是相对页面窗口宽度和 高度的高度的高度的高度的百分比百分比百分比百分比。17第第3节文本的格式化节文本的格式化3.13.1标题字体标题字体3.23.2段落和换行段落和换行3.3 3.3 正文文字正文文字3.4 3.4 字符实体字符实体 一、一、一、一、标题文字标题文字标题文
29、字标题文字 标标标标题题题题是是是是一一一一段段段段文文文文字字字字内内内内容容容容的的的的核核核核心心心心,通通通通常常常常用用用用加加加加强强强强的的的的效效效效果果果果来来来来表表表表示示示示。网网网网页页页页中中中中可可可可以以以以通通通通过过过过设置不同大小的标题来增加文章的条理。设置不同大小的标题来增加文章的条理。设置不同大小的标题来增加文章的条理。设置不同大小的标题来增加文章的条理。其用法:其用法:其用法:其用法:标题文字标题文字标题文字标题文字/例如:标题文字设置代码:例如:标题文字设置代码:例如:标题文字设置代码:例如:标题文字设置代码:网站规划与网页设计网站规划与网页设计网
30、站规划与网页设计网站规划与网页设计 网上教学系统网上教学系统网上教学系统网上教学系统 网上教学系统网上教学系统网上教学系统网上教学系统 网上教学系统网上教学系统网上教学系统网上教学系统 网上教学系统网上教学系统网上教学系统网上教学系统 网上教学系统网上教学系统网上教学系统网上教学系统 网上教学系统网上教学系统网上教学系统网上教学系统 第第3节文本的格式化节文本的格式化19 二、段落和换行二、段落和换行二、段落和换行二、段落和换行 在用浏览器浏览一个网页时,只有在在用浏览器浏览一个网页时,只有在在用浏览器浏览一个网页时,只有在在用浏览器浏览一个网页时,只有在HTMLHTMLHTMLHTML源文件
31、中遇到换源文件中遇到换源文件中遇到换源文件中遇到换行或换段的标签时,才进行换行或换段的操作。行或换段的标签时,才进行换行或换段的操作。行或换段的标签时,才进行换行或换段的操作。行或换段的标签时,才进行换行或换段的操作。1 1 1 1、强制换段标签、强制换段标签、强制换段标签、强制换段标签 在在在在HTMLHTMLHTMLHTML文档中,用文档中,用文档中,用文档中,用来强制换行、分段来强制换行、分段来强制换行、分段来强制换行、分段。标签不但能使文字换到下一行,还可以使两段标签不但能使文字换到下一行,还可以使两段标签不但能使文字换到下一行,还可以使两段标签不但能使文字换到下一行,还可以使两段之间
32、多一空行。之间多一空行。之间多一空行。之间多一空行。第第3节文本的格式化节文本的格式化20 2 2 2 2、强制换行标签、强制换行标签、强制换行标签、强制换行标签 放放放放在在在在一一一一行行行行的的的的末末末末尾尾尾尾,可可可可以以以以使使使使后后后后面面面面的的的的文文文文字字字字、图图图图片片片片、表表表表格格格格等等等等元元元元素素素素显显显显示示示示于于于于下下下下一一一一行行行行,而而而而行行行行与与与与行行行行之之之之建建建建不不不不会会会会留留留留下下下下空空空空行行行行,即强制文本换行。其用法为:即强制文本换行。其用法为:即强制文本换行。其用法为:即强制文本换行。其用法为:文
33、字文字文字文字 第第3节文本的格式化节文本的格式化21 3 3 3 3、显示预排格式、显示预排格式、显示预排格式、显示预排格式 如如如如果果果果希希希希望望望望在在在在浏浏浏浏览览览览网网网网页页页页时时时时,保保保保留留留留在在在在编编编编辑辑辑辑工工工工具具具具中中中中已已已已经经经经排排排排好好好好的的的的段段段段落落落落格格格格式式式式,可可可可以以以以使使使使用用用用标标标标签签签签将将将将预预预预先先先先排排排排好好好好的的的的格格格格式式式式保保保保留留留留下来。显示预排格式的标签格式为:下来。显示预排格式的标签格式为:下来。显示预排格式的标签格式为:下来。显示预排格式的标签格式
34、为:预先排好的格式预先排好的格式预先排好的格式预先排好的格式 4 4 4 4、文字的对齐文字的对齐文字的对齐文字的对齐 在页面中,文本元素对齐的设置主要使用在页面中,文本元素对齐的设置主要使用在页面中,文本元素对齐的设置主要使用在页面中,文本元素对齐的设置主要使用alignalignalignalign属性,属性,属性,属性,除此之外还可以使用除此之外还可以使用除此之外还可以使用除此之外还可以使用标签来设置居中对齐。标签来设置居中对齐。标签来设置居中对齐。标签来设置居中对齐。(1 1 1 1)alignalignalignalign属性属性属性属性 它是跟许多元素都有关的属性它是跟许多元素都有
35、关的属性它是跟许多元素都有关的属性它是跟许多元素都有关的属性 第第3节文本的格式化节文本的格式化22(2 2 2 2)centercentercentercenter 该该该该元元元元素素素素确确确确定定定定位位位位于于于于它它它它之之之之间间间间的的的的对对对对象象象象定定定定位位位位于于于于页页页页面面面面的的的的中中中中央央央央,其其其其用用用用法为:法为:法为:法为:文本内容文本内容文本内容文本内容 5 5 5 5、水平线、水平线、水平线、水平线 用法为:用法为:用法为:用法为:hr align=hr align=hr align=第第3节文本的格式化节文本的格式化23属性:属性:wi
36、dthwidth标尺线长度,标尺线长度,value1value1可以是点数,如可以是点数,如5050、100100、200200等,窗口改变时,横线宽度不变,也可以是相对窗口的百等,窗口改变时,横线宽度不变,也可以是相对窗口的百分比,如分比,如50%50%、100%100%,默认是,默认是100%100%;sizesize标尺线的高度,标尺线的高度,value2value2的值可以是绝对点数,也可以的值可以是绝对点数,也可以是(相对长度的)百分比,默认高度为是(相对长度的)百分比,默认高度为1 1;alignalign在页面中的水平位置,在页面中的水平位置,value3value3的值可以是的
37、值可以是leftleft(居(居左)、左)、rightright(居右)、(居右)、centercenter(居中),默认是居中;(居中),默认是居中;colorcolor标尺线的颜色,标尺线的颜色,color1color1为为#加加6 6位十六进制位十六进制 RGB RGB 数码数码或者是下列预定义色彩,如或者是下列预定义色彩,如BlackBlack、r reded、whitewhite等。等。说明:说明:当当sizesize值较大时,可以产生长方形或正方形图形。值较大时,可以产生长方形或正方形图形。.第第3节文本的格式化节文本的格式化24 三、正文文字三、正文文字三、正文文字三、正文文字
38、网网网网页页页页中中中中的的的的文文文文字字字字可可可可以以以以设设设设置置置置为为为为不不不不同同同同大大大大小小小小、字字字字体体体体、字字字字形形形形、颜颜颜颜色色色色。用用用用标签来设置。其用法为:标签来设置。其用法为:标签来设置。其用法为:标签来设置。其用法为:font size=font size=font size=被设置的文字被设置的文字被设置的文字被设置的文字 1 1 1 1、设置字的大小设置字的大小设置字的大小设置字的大小 用用用用sizesizesizesize来设置文字的相对大小,取值为来设置文字的相对大小,取值为来设置文字的相对大小,取值为来设置文字的相对大小,取值为
39、n=1n=1n=1n=1,2 2 2 2,3 3 3 3,4 4 4 4,5 5 5 5,6 6 6 6,7 7 7 7;+n+n+n+n,-n-n-n-n 表示相对基准字号的大小,如基准字号为表示相对基准字号的大小,如基准字号为表示相对基准字号的大小,如基准字号为表示相对基准字号的大小,如基准字号为3 3号,号,号,号,则则则则+3+3表示表示表示表示6 6号字。基准字号用如下标记定义:号字。基准字号用如下标记定义:号字。基准字号用如下标记定义:号字。基准字号用如下标记定义:BASEFONT size=其中其中其中其中“基准字号基准字号基准字号基准字号”也也也也是是是是1717之间的整数;之
40、间的整数;之间的整数;之间的整数;2.2.2.2.设置字体设置字体设置字体设置字体 用用用用facefacefaceface来设置文字的字体,如黑体、宋体、隶书等。来设置文字的字体,如黑体、宋体、隶书等。来设置文字的字体,如黑体、宋体、隶书等。来设置文字的字体,如黑体、宋体、隶书等。第第3节文本的格式化节文本的格式化253 3 3 3、设置文字颜色、设置文字颜色、设置文字颜色、设置文字颜色用用用用colorcolorcolorcolor来设置文字颜色。利用它可以设定网页、段落、来设置文字颜色。利用它可以设定网页、段落、来设置文字颜色。利用它可以设定网页、段落、来设置文字颜色。利用它可以设定网页
41、、段落、文字等的颜色。文字等的颜色。文字等的颜色。文字等的颜色。颜色的取值是颜色的取值是颜色的取值是颜色的取值是以以以以“#”引导的一个十六进制代码引导的一个十六进制代码引导的一个十六进制代码引导的一个十六进制代码来表示。来表示。来表示。来表示。例如:例如:例如:例如:感觉的萌芽感觉的萌芽感觉的萌芽感觉的萌芽/fontfontfont颜色的取值还可以使用颜色的取值还可以使用颜色的取值还可以使用颜色的取值还可以使用标准颜色名标准颜色名标准颜色名标准颜色名表示。表示。表示。表示。例如:例如:例如:例如:font color=font color=font color=感觉的萌芽感觉的萌芽感觉的萌芽
42、感觉的萌芽第第3节文本的格式化节文本的格式化26注意:注意:注意:注意:浏览器显示的字体与客户端安装的字体有关,如浏览器显示的字体与客户端安装的字体有关,如浏览器显示的字体与客户端安装的字体有关,如浏览器显示的字体与客户端安装的字体有关,如果网页文件中设置了客户端没有安装的字体,则以默果网页文件中设置了客户端没有安装的字体,则以默果网页文件中设置了客户端没有安装的字体,则以默果网页文件中设置了客户端没有安装的字体,则以默认的宋体字显示。因此,在使用字体时,应尽量使用认的宋体字显示。因此,在使用字体时,应尽量使用认的宋体字显示。因此,在使用字体时,应尽量使用认的宋体字显示。因此,在使用字体时,应
43、尽量使用一般操作系统都会安装的宋体、黑体、楷体字。一般操作系统都会安装的宋体、黑体、楷体字。一般操作系统都会安装的宋体、黑体、楷体字。一般操作系统都会安装的宋体、黑体、楷体字。如果仍然想用这些字体,并使用户能看到他的效果,如果仍然想用这些字体,并使用户能看到他的效果,如果仍然想用这些字体,并使用户能看到他的效果,如果仍然想用这些字体,并使用户能看到他的效果,可以将这些文字做成图片插入到网页中。可以将这些文字做成图片插入到网页中。可以将这些文字做成图片插入到网页中。可以将这些文字做成图片插入到网页中。标记标记标记标记 标记的作用范围为选定的文本,但标记的作用范围为选定的文本,但标记的作用范围为选
44、定的文本,但标记的作用范围为选定的文本,但标记的作用范围为标记的作用范围为标记的作用范围为标记的作用范围为标记之间标记之间标记之间标记之间的全部文本。的全部文本。的全部文本。的全部文本。标记标记标记标记为单标记,必须放在为单标记,必须放在为单标记,必须放在为单标记,必须放在网页的头部。网页的头部。网页的头部。网页的头部。第第3节文本的格式化节文本的格式化274.4.4.4.设置字形设置字形设置字形设置字形 字形就是文字的风格,如粗体、斜体、下划线、上标、字形就是文字的风格,如粗体、斜体、下划线、上标、字形就是文字的风格,如粗体、斜体、下划线、上标、字形就是文字的风格,如粗体、斜体、下划线、上标
45、、下标等。下标等。下标等。下标等。第第3节文本的格式化节文本的格式化 将文字格式化成黑体将文字格式化成黑体 I 将文字格式化成斜体将文字格式化成斜体 u 将文字增加下划线将文字增加下划线 将文字格式化成打字机字体将文字格式化成打字机字体 sup 将文字格式化成上角标将文字格式化成上角标 sub 将文字格式化成下角标将文字格式化成下角标28 将文字中间画删除线将文字中间画删除线 设置字体为强调设置字体为强调 strong 加重文本显示加重文本显示 code 将程序代码(如将程序代码(如JAVEJAVE、C+C+源程源程 序等)显示成等宽字体。序等)显示成等宽字体。指定一个样本名称,浏览器一般指定
46、一个样本名称,浏览器一般 用等宽字体显示它。用等宽字体显示它。small 将文字相对缩小显示将文字相对缩小显示 big 将文字相对放大显示将文字相对放大显示 示例示例第第3节文本的格式化节文本的格式化29四、字符实体四、字符实体四、字符实体四、字符实体 由于由于由于由于HTMLHTMLHTMLHTML文档是纯粹的文档是纯粹的文档是纯粹的文档是纯粹的ASCIIASCIIASCIIASCII文本,它只支持文本,它只支持文本,它只支持文本,它只支持26262626个大个大个大个大小写字母、数字及其他常用的一些小写字母、数字及其他常用的一些小写字母、数字及其他常用的一些小写字母、数字及其他常用的一些A
47、SCIIASCIIASCIIASCII字符,字符,字符,字符,如如如如#$#$#$#$等,另外像等,另外像等,另外像等,另外像“”“”“”“”“,“”等用于等用于等用于等用于HTMLHTMLHTMLHTML标记元素的字符以及文档中的空格等,浏览器都标记元素的字符以及文档中的空格等,浏览器都标记元素的字符以及文档中的空格等,浏览器都标记元素的字符以及文档中的空格等,浏览器都会忽略,不会显示出来,故这类字符无法用原来会忽略,不会显示出来,故这类字符无法用原来会忽略,不会显示出来,故这类字符无法用原来会忽略,不会显示出来,故这类字符无法用原来的字符标记显示。解决方法就是使用字符实体。的字符标记显示。
48、解决方法就是使用字符实体。的字符标记显示。解决方法就是使用字符实体。的字符标记显示。解决方法就是使用字符实体。一个字符实体的通常一个字符实体的通常一个字符实体的通常一个字符实体的通常格式为格式为格式为格式为“”,其中,其中,其中,其中“#”代代代代表字符实体名称或字符的表字符实体名称或字符的表字符实体名称或字符的表字符实体名称或字符的ASCIIASCIIASCIIASCII码值。码值。码值。码值。第第3节文本的格式化节文本的格式化30第第3节文本的格式化节文本的格式化 字符串字符串 表示值表示值&&;<<;©©;®®;&t
49、rade&trade;££;¥¥;&euro&euro;  ;空格空格""“31n n五五五五.文本对齐方式标记文本对齐方式标记文本对齐方式标记文本对齐方式标记n n功能:功能:功能:功能:设置多个段落的文本居中、居左,还是居右。设置多个段落的文本居中、居左,还是居右。设置多个段落的文本居中、居左,还是居右。设置多个段落的文本居中、居左,还是居右。n n格式:格式:格式:格式:Div align=Div align=Div align=(文本文本文本文本)。n n属性:属性:属性:属性:alignalignalignalign
50、是对齐方式,其值为是对齐方式,其值为是对齐方式,其值为是对齐方式,其值为centercentercentercenter、leftleftleftleft或或或或rightrightrightright。n n说明:说明:说明:说明:n n对齐格式可以在多个标记中实现,如对齐格式可以在多个标记中实现,如对齐格式可以在多个标记中实现,如对齐格式可以在多个标记中实现,如、等。如果等。如果等。如果等。如果多个段落有相同的对齐方式,则可以将这些段落嵌套进多个段落有相同的对齐方式,则可以将这些段落嵌套进多个段落有相同的对齐方式,则可以将这些段落嵌套进多个段落有相同的对齐方式,则可以将这些段落嵌套进、之中