第一讲HTML语言基础.ppt

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

1、第一讲第一讲 HTML语言基础语言基础HTMLHTML即超文本标识语言，它是一种用于编写超文本文即超文本标识语言，它是一种用于编写超文本文 档的标记语言。档的标记语言。自从自从19901990年首次应用于网页编辑后，年首次应用于网页编辑后，HTMLHTML迅速成为网迅速成为网页编辑的主流语言。几乎所有的网页都是由页编辑的主流语言。几乎所有的网页都是由HTMLHTML或以或以其他程序语言嵌套在其他程序语言嵌套在HTMLHTML中编写的。中编写的。HTMLHTML不是一种程序设计语言，而是一种结构语言，与不是一种程序设计语言，而是一种结构语言，与平台无关，只要有相应的浏览器程序，就可以运行平台无关

2、，只要有相应的浏览器程序，就可以运行HTMLHTML文档。文档。一、一、HTML文档的基本结构文档的基本结构（1）1Html的基本结构的基本结构 html标志着标志着htmlhtml文档开始文档开始 head文档标题文档标题/title文档的主体部分文档的主体部分/body 标志着标志着htmlhtml文档结束文档结束一、一、HTML文档的基本结构文档的基本结构（2）2标签标签 文档标识符，表示文档是以超文本标识语言文档标识符，表示文档是以超文本标识语言（htmlhtml）编写的，不带任何属性。（常用的编写的，不带任何属性。（常用的WebWeb浏览器都浏览器都可以自动识别可以自动识别htmlh

3、tml文档，并不要求有文档，并不要求有 html标签）标签）3标签标签 文档头部分，规定该文档的标题，出现在浏览器的文档头部分，规定该文档的标题，出现在浏览器的标题栏中。标题栏中。一、一、HTML文档的基本结构文档的基本结构（3）title标签：规定标签：规定htmlhtml的标题。的标题。标签标签:规定文档的属性，说明该文档是可以规定文档的属性，说明该文档是可以 按关键字索引的。按关键字索引的。4标签标签 文档主体部分，规定浏览器窗口用户区显示的内容。文档主体部分，规定浏览器窗口用户区显示的内容。“bgcolorbgcolor”属性：规定属性：规定htmlhtml文档的背景色。文档的背景色。

4、“texttext”属性：规定属性：规定htmlhtml文档中文字的颜色。文档中文字的颜色。“linklink”属性：规定属性：规定htmlhtml文档中待连接超链接对象的颜文档中待连接超链接对象的颜色。色。一、一、HTML文档的基本结构（文档的基本结构（4）“alinkalink”属性：规定属性：规定htmlhtml文档连接中超链接对象的颜文档连接中超链接对象的颜色色“vlinkvlink”属性：规定属性：规定htmlhtml文档已连接超链接对象的颜文档已连接超链接对象的颜色。色。在指定对象的颜色时，可以使用该在指定对象的颜色时，可以使用该颜色的代码颜色的代码或直接或直接使用该颜色对应的使用

5、该颜色对应的英文单词英文单词。如：。如：或者或者 二、文本（二、文本（1）1标签标签 换行标签，单独出现，作用相当于插入一个回换行标签，单独出现，作用相当于插入一个回车符。如果没有换行标签，浏览器将根据浏览器窗车符。如果没有换行标签，浏览器将根据浏览器窗口的宽度尽可能长地显示文本。口的宽度尽可能长地显示文本。2标签（标签（i=1,2,3,4,5,6)中间的文字是中间的文字是htmlhtml文档中的标题，以黑体显示，文档中的标题，以黑体显示，i i的值越小，字体越大越粗。隐含有换行标签的作的值越小，字体越大越粗。隐含有换行标签的作用。用。二、文本（二、文本（2）“colorcolor”属性：规定

6、标题的颜色属性：规定标题的颜色“alignalign”属性：规定标题的位置属性：规定标题的位置（left,center,rightleft,center,right）3标签标签 段落标签，可单独使用，也可以成对使用。作段落标签，可单独使用，也可以成对使用。作用是换行并插入一个空白行。用是换行并插入一个空白行。当成对使用时，可以添加当成对使用时，可以添加“alignalign”属性属性（left,center,rightleft,center,right），），规定段落在浏览器中的规定段落在浏览器中的位置。位置。二、文本（二、文本（3）4标签标签 水平线标签，单独使用，作用是换行并在该行水平线标

7、签，单独使用，作用是换行并在该行下面画一条水平直线，直线的上下两端都会留出一下面画一条水平直线，直线的上下两端都会留出一定的空白。定的空白。“sizesize”属性：规定水平线的高度属性：规定水平线的高度“widthwidth”属性：规定水平线的宽度属性：规定水平线的宽度“alignalign”属性：规定水平线在浏览器窗口的位置属性：规定水平线在浏览器窗口的位置（left,center,rightleft,center,right）二、文本（二、文本（4）5标签标签 预格式化标签，浏览器将按编辑文档时的字符预格式化标签，浏览器将按编辑文档时的字符位置将位置将 pre和和/pre标签之间的内容一

8、成不变地标签之间的内容一成不变地显示出来。显示出来。6粗体标签粗体标签8 下划线标签下划线标签7 斜体标签斜体标签9 地址标签地址标签三、图像（三、图像（1）在在htmlhtml文档中插入图像是通过文档中插入图像是通过 标签来实标签来实现的。现的。1Src属性属性 用于指出被引用的图像文件所在位置。用于指出被引用的图像文件所在位置。2Width、height属性属性 图像的宽度和高度属性图像的宽度和高度属性。三、图像（三、图像（2）3align属性属性 alignalign属性的参数值为属性的参数值为toptop、middlemiddle、bottombottom之一，之一，分别表示与图像相邻

9、的文字位于图像的左上方、左面分别表示与图像相邻的文字位于图像的左上方、左面中间和右下方。中间和右下方。4alt属性属性 在原先显示图片的地方显示一些有关图像的信息。在原先显示图片的地方显示一些有关图像的信息。5vspace属性属性 指定图像与其垂直方向上相邻对象之间的距离指定图像与其垂直方向上相邻对象之间的距离。三、图像（三、图像（3）6hspace属性属性 指定图像与其水平方向上相邻对象之间的距离指定图像与其水平方向上相邻对象之间的距离。7border属性属性 指定图像边框的宽度或取消边框（指定图像边框的宽度或取消边框（border=0border=0）。）。四、列表元素（四、列表元素（1）

10、1无序列表无序列表 通过通过 /无序列表标签和无序列表标签和 项目标签来项目标签来实现的。实现的。2排序列表排序列表 通过通过 /排序列表标签和排序列表标签和 项目标签来项目标签来实现的。可以在实现的。可以在 标签中添加标签中添加startstart属性来指定序列属性来指定序列的起始号，缺省时，序列的起始号为的起始号，缺省时，序列的起始号为1 1。四、列表元素（四、列表元素（2）3目录列表目录列表 通过通过 dir目录列表标签和目录列表标签和 项目标签项目标签来实现的。显示效果与无序列表相同。来实现的。显示效果与无序列表相同。4菜单列表菜单列表 通过通过 menu排序列表标签和排序列表标签和

11、项目标项目标签来实现的。显示效果基本上与无序列表相同，只不签来实现的。显示效果基本上与无序列表相同，只不过在排列上更加紧凑。过在排列上更加紧凑。四、列表元素（四、列表元素（3）5描述性列表描述性列表 通过通过 dl描述性列表标签和描述性列表标签和 描述项标描述项标签、签、解释项标签来实现的。在显示时，解释项的解释项标签来实现的。在显示时，解释项的内容会自动缩进一定的距离。内容会自动缩进一定的距离。五、表格元素（五、表格元素（1）1标签标签 表格标识符，成对出现。主要属性有：表格标识符，成对出现。主要属性有：（1 1）borderborder属性属性：表示表格边框宽度所占的像素点数；：表示表格边

12、框宽度所占的像素点数；可以不带参数值，仅表示该表格是有边框的。可以不带参数值，仅表示该表格是有边框的。（2 2）widthwidth和和heightheight属性属性：规定表格的宽度和高度；可：规定表格的宽度和高度；可 以用数字、百分数（占浏览器窗口的百分比）。以用数字、百分数（占浏览器窗口的百分比）。（3 3）alignalign属性属性：参数值为：参数值为leftleft、centercenter或者或者rightright，分别表示表格位于其相连文字的左侧、表格水平分别表示表格位于其相连文字的左侧、表格水平 居中和表格位于与其相连的文字右侧。居中和表格位于与其相连的文字右侧。五、表格元

13、素（五、表格元素（2）（4 4）cellspancingcellspancing属性属性：指定表格各单元格之间的空：指定表格各单元格之间的空 隙。隙。（5 5）cellpaddingcellpadding属性属性：指定单元格内容与单元格边界：指定单元格内容与单元格边界 之间空白距离的大小。之间空白距离的大小。五、表格元素（五、表格元素（3）2标签标签 表格标题标签，成对出现。主要属性有：表格标题标签，成对出现。主要属性有：（1 1）alignalign 属性属性：参数值为：参数值为leftleft、centercenter或者或者rightright，分别表示表格标题与表格的左沿对齐、位于表格分别表示表格标题与表格的左沿对齐、位于表格 中间和与表格的右沿对齐。缺省时，表格标题位中间和与表格的右沿对齐。缺省时，表格标题位 于表格中间。于表格中间。（2 2）valignvalign属性属性：参数值为：参数值为toptop和和bottombottom之一，分别表之一，分别表 示表格标题位于表格的上方和下方。缺省时，位示表格标题位于表格的上方和下方。缺省时，位 于上方。于上方。