第2章语言基础精选文档.ppt

《第2章语言基础精选文档.ppt》由会员分享，可在线阅读，更多相关《第2章语言基础精选文档.ppt（31页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、第2章语言基础本讲稿第一页，共三十一页n2.1 HTML概述概述n2.2 文本的编辑文本的编辑n2.3 图像编辑图像编辑n2.4 建立超链接建立超链接n2.5 表格与框架表格与框架n本章小结本章小结第第第第2 2章章章章 HTMLHTML语言基础语言基础语言基础语言基础本讲稿第二页，共三十一页2.1 HTML概述概述2.1.1 HTML简介简介2.1.2 HTML语法结构语法结构本讲稿第三页，共三十一页HTML（Hyper Text Markup Language）又称）又称超文本标识语言，是一种标识性的语言，是网页设超文本标识语言，是一种标识性的语言，是网页设计的最初语言。文件的扩展名计的最

2、初语言。文件的扩展名:“html”或或“htm”。例2.1 简单的HTML文档 长春欢迎您！这里是长春悠游网，我们带您畅游长春！由由“”组成的就是标记。在组成的就是标记。在HTML语言中语言中标记分标记分“单标记单标记”和和“围堵标记围堵标记”。2.1.1 HTML2.1.1 HTML2.1.1 HTML2.1.1 HTML简介简介简介简介 2.1 HTML概述概述本讲稿第四页，共三十一页1围堵标记围堵标记格式：格式：2单标记单标记格式：格式：只有起始标记，没有结束标记。最常用的单标记是只有起始标记，没有结束标记。最常用的单标记是,它表示段内换行。它表示段内换行。3标记属性标记属性格式：格式：

3、各属性间无前后顺序，属性也可省略，当省各属性间无前后顺序，属性也可省略，当省略属性时取标记的默认值。略属性时取标记的默认值。2.1.1 HTML2.1.1 HTML2.1.1 HTML2.1.1 HTML简介简介简介简介 2.1 HTML概述概述本讲稿第五页，共三十一页HTML文档的基本结构：文档的基本结构：文件开始标头区开始.标题区标头区结束文件主体内容开始文件主体内容文件主体内容结束文件结束其中其中之间表示这是个网页文件，之间表示这是个网页文件，是必有的标记。是必有的标记。2.1.2 HTML2.1.2 HTML2.1.2 HTML2.1.2 HTML语法结构语法结构语法结构语法结构 2.

4、1 HTML概述概述本讲稿第六页，共三十一页2.2 2.2 文本的编辑文本的编辑文本的编辑文本的编辑2.2.1 段落标记段落标记2.2.2 文本标记文本标记2.2.3 标题显示等级标题显示等级2.2.4 列表列表本讲稿第七页，共三十一页1段落（段落（）基本语法格式为：基本语法格式为：其中参数其中参数align用于设定段落的位置是靠左、用于设定段落的位置是靠左、靠右还是居中。默认值是靠左；除靠右还是居中。默认值是靠左；除align之外之外还有其他参数如还有其他参数如class。class参数是可选项，如参数是可选项，如果没有将按照默认值显示。果没有将按照默认值显示。2换行换行单标记，放在一行的末

5、尾，可以在一个段落内单标记，放在一行的末尾，可以在一个段落内实现文本的强制换行，设置标记后面的文本字、图实现文本的强制换行，设置标记后面的文本字、图像和表格等内容显示于下一行。像和表格等内容显示于下一行。2.2.12.2.12.2.12.2.1 段落标记段落标记段落标记段落标记 2.2 文本的编辑文本的编辑本讲稿第八页，共三十一页1字体标记字体标记其基本语法格式为：其基本语法格式为：Size：设置字体的显示字号，范围是从：设置字体的显示字号，范围是从“17”，其中，其中“3”是默认值。是默认值。Color：设置文本的颜色，值可以是颜色名（英文如：设置文本的颜色，值可以是颜色名（英文如red代表

6、红色）或颜色的十六进制代码（代表红色）或颜色的十六进制代码（#000000代表黑色，代表黑色，#FFFFFF代表白色）。代表白色）。Face：设置文本显示的字体，值为字体的名称。：设置文本显示的字体，值为字体的名称。在文本的标记中还有很多常用的标记，比如表示字体在文本的标记中还有很多常用的标记，比如表示字体效果的，效果的，(黑体黑体)，（斜体），（斜体），（加下划线）。（加下划线）。2.2.22.2.22.2.22.2.2 文本标记文本标记文本标记文本标记 2.2 文本的编辑文本的编辑本讲稿第九页，共三十一页2特殊字符特殊字符HTML中除了我们上面学的的一些标记外，还中除了我们上面学的的一些标

7、记外，还有一些我们常用的特殊字符比如有一些我们常用的特殊字符比如“”，这些特殊，这些特殊字符在字符在HTML语言中都有对的转义符，常用的转义符语言中都有对的转义符，常用的转义符与特殊字符参见下表：与特殊字符参见下表：2.2.22.2.22.2.22.2.2 文本标记文本标记文本标记文本标记 2.2 文本的编辑文本的编辑HTML 代码显示结果说明<大于号或显示标记&&可用于显示其它特殊字符"引号®注册©版权™商标 不断行的空格本讲稿第十页，共三十一页3水平线标记水平线标记水平线是在网页上划出一条水平的分割线，用水平线是在网页上划出一

8、条水平的分割线，用来标记水平线。语法格式为：来标记水平线。语法格式为：Size：设置水平线的高度，以像素为单位。：设置水平线的高度，以像素为单位。Color：设置水平线的颜色。：设置水平线的颜色。Width：设置水平线的宽度，单位是像素或百分比，像：设置水平线的宽度，单位是像素或百分比，像素是绝对大小，不会随着程序窗口的大小而改，百分比是相素是绝对大小，不会随着程序窗口的大小而改，百分比是相对于程序窗口水平线所占的比例，会随着程序窗口的大小而对于程序窗口水平线所占的比例，会随着程序窗口的大小而改变。改变。Align：设置水平线的对齐方式。对齐方式有左对齐，：设置水平线的对齐方式。对齐方式有左对

9、齐，居中，右对齐三种。居中，右对齐三种。2.2.22.2.22.2.22.2.2 文本标记文本标记文本标记文本标记 2.2 文本的编辑文本的编辑本讲稿第十一页，共三十一页语法格式为：语法格式为：n：表示不同级别的标题，：表示不同级别的标题，n值可以是值可以是1-6中的任中的任意数字，其中意数字，其中1表示的标题字体最大。另外，可以表示的标题字体最大。另外，可以用用align属性设置对齐方式，常用的有左对齐，居中，属性设置对齐方式，常用的有左对齐，居中，右对齐三种对齐方式。右对齐三种对齐方式。2.2.32.2.32.2.32.2.3 标题显示等级标题显示等级标题显示等级标题显示等级 2.2 文本

10、的编辑文本的编辑本讲稿第十二页，共三十一页在在HTML中，列表常用的有中，列表常用的有“有序列表有序列表”和和“无序无序列表列表”。1有序列表有序列表基本语法结构为：基本语法结构为：项目1项目2项目n2.2.42.2.42.2.42.2.4 列表列表列表列表 2.2 文本的编辑文本的编辑本讲稿第十三页，共三十一页1有序列表有序列表Type：设置列表的序号类型，常用序号如下：设置列表的序号类型，常用序号如下：n=1：用数字作为序号。：用数字作为序号。n=A；用大写字母作为序号。；用大写字母作为序号。n=a：用小写字母作为序号。：用小写字母作为序号。n=I：用大写罗马数字作为序号。：用大写罗马数字

11、作为序号。n=i：用小写罗马数字作为序号。：用小写罗马数字作为序号。Start：为可选参数，用于设置序号的起始数值。如不添：为可选参数，用于设置序号的起始数值。如不添加加“start”则从每类序号的第一个序号开始。则从每类序号的第一个序号开始。2.2.42.2.42.2.42.2.4 列表列表列表列表 2.2 文本的编辑文本的编辑本讲稿第十四页，共三十一页2无序列表无序列表基本语法结构为：基本语法结构为：项目1项目2项目nType:设置符号形状，有实心圆、小正方形、设置符号形状，有实心圆、小正方形、空心圆三种，具体如下：空心圆三种，具体如下：n=disk：符号为实心圆。：符号为实心圆。n=sq

12、uare：符号为正方形。：符号为正方形。n=circle：符号为空心圆。：符号为空心圆。2.2.42.2.42.2.42.2.4 列表列表列表列表 2.2 文本的编辑文本的编辑本讲稿第十五页，共三十一页2 2.3 3 图像编辑图像编辑图像编辑图像编辑2.3.1 插入图像插入图像2.3.2 使用背景图像使用背景图像我们在网页上经常会浏览图像，适当使用图我们在网页上经常会浏览图像，适当使用图像可以增加网页的美观。在网页最常用到的是插像可以增加网页的美观。在网页最常用到的是插入图像和设置背景图像。入图像和设置背景图像。本讲稿第十六页，共三十一页1语法格式：语法格式：，单标记单标记Src：指明要添加的

13、图像所在的具体路径和文件名。：指明要添加的图像所在的具体路径和文件名。路径可以是相对路径，也可以是绝对路径。例：路径可以是相对路径，也可以是绝对路径。例：。绝对路径：完整的描述文件位置的路径就是绝对绝对路径：完整的描述文件位置的路径就是绝对路径。对于绝对路径可以不需要知道其他任何信息就路径。对于绝对路径可以不需要知道其他任何信息就可以判断出文件的位置。可以判断出文件的位置。相对路径：所谓相对路径相对路径：所谓相对路径,顾名思义就是当前文档与顾名思义就是当前文档与目标的相对位置。例目标的相对位置。例.2.3.12.3.12.3.12.3.1插入图像插入图像插入图像插入图像 2.3 图像编辑图像编

14、辑本讲稿第十七页，共三十一页2图像的属性图像的属性除了除了“src”以外，以外，还有其他属性，可以定还有其他属性，可以定义图像的对齐方向，与周围元素的距离等，各属性及作义图像的对齐方向，与周围元素的距离等，各属性及作用见表用见表2.2。表表2.2 图像属性列表图像属性列表2.3.12.3.12.3.12.3.1插入图像插入图像插入图像插入图像 2.3 图像编辑图像编辑名称作用border 设定图像的边框 vspace 设定图像、文字与图像上下之间的间隔 hspace 设定图像、文字与图像左右之间的间隔 width 调整图像的宽度 height 调整图像的高度 alt 当浏览器无法显示图像时，会

15、显示出alt属性所设定的文字 本讲稿第十八页，共三十一页语法格式为：语法格式为：2.3.2 2.3.2 2.3.2 2.3.2 使用背景图像使用背景图像使用背景图像使用背景图像 2.3 图像编辑图像编辑本讲稿第十九页，共三十一页2 2.4 4 建立超链接建立超链接建立超链接建立超链接2.4.1 建立超链接建立超链接2.4.2 使用书签使用书签2.4.3 标记新窗口和基准链接标记新窗口和基准链接本讲稿第二十页，共三十一页建立超链接的标记是建立超链接的标记是，语法格式为：，语法格式为：超链接标识超链接标识url：指明链接目标的具体路径和文件名。：指明链接目标的具体路径和文件名。超链接标识：是网页中

16、链接的载体，可以是超链接标识：是网页中链接的载体，可以是文字或图像等页面元素，用户点击它就会跳到超文字或图像等页面元素，用户点击它就会跳到超链接的目标位置。链接的目标位置。2.4.12.4.12.4.12.4.1 建立超链接建立超链接建立超链接建立超链接 2.4 建立超链接建立超链接本讲稿第二十一页，共三十一页定义书签定义书签在在HTML中，首先要定义书签，然后才在链接中，首先要定义书签，然后才在链接使用。定义书签的语法格式为：使用。定义书签的语法格式为：书签名不能用中文，只能用英文和数字。书签名不能用中文，只能用英文和数字。使用书签链接使用书签链接其链接的格式为：其链接的格式为：超链接标识#

17、与书签名之间不能有空格。与书签名之间不能有空格。2.4.22.4.22.4.22.4.2使用书签使用书签使用书签使用书签 2.4 建立超链接建立超链接本讲稿第二十二页，共三十一页1标记新窗口（标记新窗口（target）“target=”_blank”，是链接标记的一个参数。，是链接标记的一个参数。语法格式为：语法格式为：超链接标识当点击链接载体的，就会在新窗口打开链接目标。当点击链接载体的，就会在新窗口打开链接目标。2基准链接基准链接标记是单标记，禁止使用结束标记，可标记是单标记，禁止使用结束标记，可以改变文件中所有链接标记的参数默认值。它只能以改变文件中所有链接标记的参数默认值。它只能位于文

18、件的开头部分，即标记位于文件的开头部分，即标记 与与 之间。语法格式为：之间。语法格式为：2.4.32.4.32.4.32.4.3 标记新窗口和基准链接标记新窗口和基准链接标记新窗口和基准链接标记新窗口和基准链接 2.4 建立超链接建立超链接本讲稿第二十三页，共三十一页2 2.5 5 表格与框架表格与框架表格与框架表格与框架2.5.1 建立表格建立表格2.5.2 表格属性表格属性2.5.3 建立框架建立框架2.5.4 框架属性框架属性本讲稿第二十四页，共三十一页表格标记有表格标记有、和和四个，他们四个，他们的具体含义是：的具体含义是：:定义表格定义表格,是表格必须的元素是表格必须的元素：定义标

19、题单元格，在这个单元格中的文字将：定义标题单元格，在这个单元格中的文字将用粗体表示。用粗体表示。：定义表格中的行。：定义表格中的行。：定义单元格，使用：定义单元格，使用标记一定要放在标记一定要放在标记内部。标记内部。上述标记中，上述标记中，可以省略，其他三个是必须的。可以省略，其他三个是必须的。具体应用见例具体应用见例2.12。标记中可以添加属性和参数，其中标记中可以添加属性和参数，其中border，用于设置表格的边框宽度，值为大于等于，用于设置表格的边框宽度，值为大于等于“0”的的整数，当值为整数，当值为“0”，在浏览器中显示无边框表格，无边框，在浏览器中显示无边框表格，无边框表格是网页布局

20、最主要的手段。表格是网页布局最主要的手段。2.5.12.5.12.5.12.5.1 建立表格建立表格建立表格建立表格 2.5 表格与框架表格与框架本讲稿第二十五页，共三十一页除了除了border外，常用的表格属性参数有：外，常用的表格属性参数有：定义单元格之间的距离，值为：定义单元格之间的距离，值为大于等于大于等于“0”的整数，单位是像素，的整数，单位是像素，“0”表示没有间距。表示没有间距。：定义单元格内的文字或其他元素：定义单元格内的文字或其他元素到边框的距离到边框的距离,值为大于等于值为大于等于“0”的整数，单位是像素，的整数，单位是像素，“0”表表示没有距离。示没有距离。：定义表格的高

21、度，值有两种单位，：定义表格的高度，值有两种单位，一是像素，表示表格高度为固定大小，一是百分比表示表一是像素，表示表格高度为固定大小，一是百分比表示表格占据整个网页的高度百分比。格占据整个网页的高度百分比。：定义表格的宽度，与高度一样有像素：定义表格的宽度，与高度一样有像素和百分比两种单位。和百分比两种单位。：定义表格边框的颜色。：定义表格边框的颜色。：定义表格的背景色：定义表格的背景色2.5.22.5.22.5.22.5.2 表格属性表格属性表格属性表格属性 2.5 表格与框架表格与框架本讲稿第二十六页，共三十一页1框架页的基本结构框架页的基本结构：标记一个普通的：标记一个普通的HTML文档

22、，用于在不支持框文档，用于在不支持框架的浏览器中显示。架的浏览器中显示。：用于定义分割窗口，可以设置窗口的分割方式及是否：用于定义分割窗口，可以设置窗口的分割方式及是否显示框架边框等。显示框架边框等。用于设置每个区域显示的内容，每个用于设置每个区域显示的内容，每个URL值指定一个事先己制值指定一个事先己制作好的文件。作好的文件。2.5.32.5.32.5.32.5.3 建立框架建立框架建立框架建立框架 2.5 表格与框架表格与框架本讲稿第二十七页，共三十一页2建立框架建立框架（1）建立纵向框架）建立纵向框架建立纵向框架的基本语法为：建立纵向框架的基本语法为：Cols：设置垂直分割窗口，用：设置

23、垂直分割窗口，用“，”分隔，它分隔，它的值可以是像素值或者是百分比，代表对应的子窗的值可以是像素值或者是百分比，代表对应的子窗体占屏幕窗口的大小。如要将屏幕分割成三个子窗体占屏幕窗口的大小。如要将屏幕分割成三个子窗口，其中两个都占整个窗口的口，其中两个都占整个窗口的30%，那么只给开始，那么只给开始的两个窗口赋值。语句为的两个窗口赋值。语句为，*代表框架剩余的部分分给最后一代表框架剩余的部分分给最后一个子窗口，当然也可以写成个子窗口，当然也可以写成。2.5.32.5.32.5.32.5.3 建立框架建立框架建立框架建立框架 2.5 表格与框架表格与框架本讲稿第二十八页，共三十一页（2）建立横框

24、架）建立横框架建立横向框架的基本语法为：建立横向框架的基本语法为：rows：这个参数用来水平分割窗口，它的值可：这个参数用来水平分割窗口，它的值可以是数字或者是百分比，代表对应的子窗口的大小，以是数字或者是百分比，代表对应的子窗口的大小，使用方法与使用方法与cols相同。相同。（3）嵌套框架）嵌套框架嵌套框架是在己有的框架中嵌入框架的结构，嵌套框架是在己有的框架中嵌入框架的结构，利用嵌套框架可以实现窗口的横向与纵向的混合分利用嵌套框架可以实现窗口的横向与纵向的混合分割。嵌套框架的设置见例割。嵌套框架的设置见例2.16.2.5.32.5.32.5.32.5.3 建立框架建立框架建立框架建立框架

25、2.5 表格与框架表格与框架本讲稿第二十九页，共三十一页常用的框架属性有以下几种：常用的框架属性有以下几种：1：设置框架的边框。值：设置框架的边框。值为为yes（或（或1）有边框或）有边框或no（或（或0）无边框。）无边框。2：设置各窗口之间的：设置各窗口之间的空白区域大小。值是以像素为单位的数值。空白区域大小。值是以像素为单位的数值。3：设置边框的颜色。值：设置边框的颜色。值可以是的英文或颜色代码。可以是的英文或颜色代码。4：设置框架是否显示滚动条。：设置框架是否显示滚动条。有三个值：有三个值：yes表示有滚动条，表示有滚动条，no表示没有，表示没有，auto表示根据内容表示根据内容的多少浏览器自动设置。的多少浏览器自动设置。5：设置框架在浏览器中不能被调：设置框架在浏览器中不能被调整。整。2.5.4 2.5.4 2.5.4 2.5.4 框架属性框架属性框架属性框架属性 2.5 表格与框架表格与框架本讲稿第三十页，共三十一页本章小结本章小结第第2章章 HTML语言基础语言基础HTML语言基础HTML概述图像编辑表格与框架建立超链接HTML简介HTML语法结构段落标记文本标记标题显示等级列表插入图像使用背景图像建立超链接标记新窗口和基准链接建立表格表格属性建立框架框架属性使用书签文本的编辑本讲稿第三十一页，共三十一页