html标签以及词汇全方面综述

1、HTML语言基础知识及使用广州市白云行知职业技术学校 简金花本次课内容：一、引入新课网页源文件及考证试题二、HTML语言（一）什么是HTML语言（二）HTML文档的结构（三）HTML文档的特点（四）查看HTML文档的方法三、HTML标签（一）什么是HTML标签（二） HTML标签的格式（三）HTML标签的特点（四）（四）HTML的颜色四、HTML标签的使用（一）文档标签（一）文档标签（二）排版标签（二）排版标签（三）链接标签（三）链接标签New Page 1图片对应的HTML语言如下:一、引入新课一、引入新课New Page 1郑智十岁在电影的台词是 “我要做球星！” “我要做马拉多纳！” “

2、我是伟大的左后卫！” “点球！点球！”（一）什么是HTML语言全写： HyperText Mark-up Language 译名： 超文件注标识语言（译名之一） 简释：一种为普通文件中某些字句加上标识的语言，其目的在于运用标签（tag）使文件达到预期的显示效果。HTML 的格式非常简单，只是由文字及标签组合而成，于编辑方面，任何文字编辑器都可以，只要能将文件另存成 ASCII 纯文字格式即可 （二）HTML文档的结构HTML文档一般由两部分组成：1 文档所要表达的内容信息；2 一系列HTML标签。HTML的标签分的标签分单标签单标签和和成对标签成对标签两种。两种。 成对标签成对标签是由首标签是

3、由首标签 和尾标签和尾标签组成的，成对标签的作用域组成的，成对标签的作用域只作用于这对标签中的文档。单独标签的格式只作用于这对标签中的文档。单独标签的格式，单独标签在相应的位置插入元，单独标签在相应的位置插入元素就可以了，大多数标签都有自己的一些属性素就可以了，大多数标签都有自己的一些属性, 属性要写在始标签内，属性用于进一步属性要写在始标签内，属性用于进一步改变显示的效果改变显示的效果, 各属性之间无先后次序，属性是可选的，属性也可以省略而采用默认各属性之间无先后次序，属性是可选的，属性也可以省略而采用默认值值;其格式如下：其格式如下： 内容内容二、HTML语言作为一般的原则，大多数属性值不

4、用加双引号。但是包括空格、号，号等特殊字符的属性作为一般的原则，大多数属性值不用加双引号。但是包括空格、号，号等特殊字符的属性值必须加入双引号。为了好的习惯，提倡全部对属性值加双引号。值必须加入双引号。为了好的习惯，提倡全部对属性值加双引号。如：如： 字体设置字体设置单独标签单独标签 是指标签单独出现，只有起始标签没有终结标签。 例如 HTML Source： I love Creation of Webpage.Its a wonderful place. 显示成： I love Creation of Webpage. Its a wonderful place. 其中换行标签便属单独标签

5、。 它的作用便是将标签后所有东西显示于下一行，可见终结标签于它是没意义的， 但有些人会为空标签加上终结标签，这是为方便记认而己，对 HTML 没有影响。 一个标准html文件应具有下面的结构： html文件开始 文件头开始 文档标题 文件头结束 文件体开始 文档的主要内容 文件体结束 html文件结束 返回注意： 网页文件格式。 标头区 : 记录文件基本资料，如作者、编写时间。 标题区 : 文件标题须使用在标头区内，可以在浏览器最上面看到标题。 本文区 : 文件资料，即在浏览器上看到的网站内容。1 通用性2 简单性、3 可扩展性、4 平台无关性、5 编辑器无关性 （四）查看HTML文档的方法查

6、看一个网页HTML源代码的方法是:打开一个网页之后，点击浏览器上的菜单“查看”，选择下面的“源文件”选项，即可打开一个记事本文件，其中就是这个网页所所有代码。可以将鼠标放置到网页上的任何位置（只要位于没有链接、图片处，最好是网页中的空白区域），点击鼠标右键，选择其中的“查看源文件”即可。 （三）HTML文档的特点三、HTML标签（一）什么是HTML标签HTML标签是由 所括住的指令，主要分为 : 单标签指令（ ）、双标签指令 ( 由 ，所构成 ) 。（二） HTML标签的格式HTML标签的格式是： 相应内容 如： 网页的标题 任何标签皆由所围住，如 标签往往成对出现标签名与小于号之间不能留有空

7、白字符。 某些标签要加上属性，某些则不必。如 Hello 如 属性只可加于起始标签中。 在起始标签之标签名前加上符号/便是其终结标签，如 标签字母大小写皆可。不同标签之间可以嵌套，但不能交叉 。（三）HTML标签的特点最后一个特点如何理解？请举例说明。（四）（四）HTML的颜色的颜色HTML 的颜色表示可分两种： 以命名方式定义常用的颜色，如 RED。 以 RGB 值表示，如 #FF0000 表示 red。 命名方式涵括的色种不多亦不甚方便，较少采用，以下介绍 RGB 值的原理： 於应用时常在每个 RGB 值之前加上符号 # 以示分别，但不加亦可。具体的颜色的表示参见另一个网页文件思考题：HT

8、ML中“#9ACD32”表示什么颜色？“#800080”呢？“#90EE90”呢？ 四、HTML标签的使用（一）文档标签（一）文档标签 上述标记中只有具属性设定。 之属性设定：例子： text=“#000000” 用以设定文字颜色。 #000000 代表黑色，亦可以采用颜色的名称，即 text=“black” 。各种颜色的值及名称可参考【HTML的颜色】。 link=#0000FF 设定一般文字属性颜色。 alink=#FF0000 设定刚按下时文字属性颜色。 vlink=#0000FF 设定属性后的颜色。（被按过）。 background=bg1.gif 设定背景墙纸。GIF 或 JPEG

9、皆可，可以是绝对途径或相对途径。 bgcolor=#FFFFFF 设定背景颜色。当己设定背景墙纸时会失去作用，除非墙纸有透明部分。 leftmargin=2 设定整份文件显示画面的左方边沿空间，单位为像素。 只适用于IE topmargin=2 设定整份文件显示画面的上方边沿空间。 只适用于IE bgproperties=fixed 固定背景墙纸，当卷动文字时墙纸不会跟著卷动。 只适用于IE 标记及属性之字母大小都可以。 ； ； ； ； ；（二）排版标签（二）排版标签：像很多电脑语言一样，HTML 文件亦提供注解功能。浏览器会忽略此标记中的文字（可以 是很多行）而不作显示，一般使用目的： 为文

10、中不同部份加上说明，方便日后修改。 这对较复杂或非私人网页尤其重要，它不单是提醒自已，亦提醒你的同事这部分 做什么、那部分做什么。 例子： 用作版权声明。 假如你不希望别人使用或复制你的网页，可加上警告字眼。 例子： ：称为段落标记。作用：为字、画、表格等之间留一空白行。 本来是一围堵标记，标于一段落的头尾，但从 HTML 2.0 开始己不需要作结尾。 的常用属性align 表示段落文字的对齐方式： 如： align=center 可选值：right, left, center。 内定值： align=left 原始码Here is the text for my paragraph. It

11、doest matter how long it is, how many space are between the words or when I decide to hit the return key. It will create a new paragraph only when I begin the tag with another one. Heres the next paragraph. 显示结果Here is the text for my paragraph. It doest matter how long it is, how many space are bet

12、ween the words or when I decide to hit the return key. It will create a new paragraph only when I begin the tag with another one. Heres the next paragraph.例子： ：称为换行标签。作用：令字、画、表格等显示于下一行。 由于浏览器会自动忽略原始码中空白和换行的部分，这令到成为最常用的标记之 一。因为无论你在原始码中编好了多漂亮的文章，若不适当地加上换行标签或段落标签， 浏览器只会将它显示成一大段。 原始码566 E Boston Post RD

13、 Mamaroneck NY 10543-9982 United States of America 显示结果566 E Boston Post RD Mamaroneck NY 10543-9982 United States of America 错误示范：（邮局可不会接受一行过的地址） 正确例子：原始码566 E Boston Post RD Mamaroneck NY 10543-9982 United States of America 显示结果566 E Boston Post RD Mamaroneck NY 10543-9982 United States of America

14、 ：称为水平线。作用：插入一条水平线。 之属性修改： 以： 为例。 noshade 表示实线（无阴影）align=LEFT 设定线条置放位置，可选择：left；right；center 三种设定值。 size=2 设定线条厚度，以像素作单位，内定为 2。 width=70% 设定线条长度，可以是绝对值（以像素作单位）或相对值，内定为 100%。 color=#0000FF 只适用于IE 设定线条颜色，内定为黑色。 #0000FF 代表蓝色，亦可以采用颜色的名称，即 text=blue 。 noshade 设定线条为平面显示，若删去则具阴影或立体，这是内定值。 例子：原始码 显示结果 ：称为居中

15、标记。作用：令字、画、表格等显示于中间。 例子：原始码Chriss First Homepage Whats new My profile 显示结果Chriss First Homepage Whats new My profile 其他的排版标签：其他的排版标签： ； ； ； ； （三）链接标签（三）链接标签1 链接的概念链接又叫超链接，超链接是从一个网页指向另一个目的端的链接。这个目的端通常是另一个网页，也可以是一幅图片、一个电子邮件地址、一个文件或一个程序。链接是HTML中最重要的功能！因为HTML拥有链接的功能，使你能接上INTERNET、WWW 享受多姿多彩的网络世界。 ： 称链接标

16、签，由 与 所围的文字、图片等等可以成为一个链接。 的一般属性设定： 例如 相关属性 : href 链接的URL位址或文件 name名称 target 指定链接到的URL位址或文件显示于那一个视窗 ( 可和 视窗标记配合使用或开新的视窗 ) href=index.html 这属性不能与另一属性 name 同时使用，使用这属性才能造成可按的链接。 当作为一当作为一外外部属性时：部属性时： href 所设定的是该链接所要连到的文件名称，若 该文件与此 html 档不是同在一目录请加上适当的路径，相对绝对皆可。 当作为一当作为一内内部属性时：部属性时： href 所设定的是该链接所要连到的同文件内参

17、考 点或指定文件之参考点，且不要包围任何字画只加上结束标示 便 可以， 例如 、 及 其中 there 便是参考点，并于其前加上符号 # 以作识别，参考点由下一个属性 name 事先于文件中埋下。例子一: 外部链接基本上链接分成 : 外部链接链接至网络的某个URL网址或文件，可参考考网络链接方式。内部链接链接同HTML文件的某个区段。和之间不要包围任何文字和图像。 原始码网络教室首页 显示结果网络教室首页退出例子二（内部连结）：请到 PenPal Garden 的 FAQ Page 刻体验一下何为内部连结。 原始码原始码 本页的内部连结 跳到 PenPal Garden 的 FAQ 部分显示结果本页的内部连结 跳到 PenPal Garden 的 FAQ 部分 name=hello 这属性是为文件埋下参考点，作为被属性，不会被显示。所以说造成一个内部连 结要使用两次 属性标记。一个使用属性 name 事先於文件中埋下一参考 点，另一个使用属性 href 连到这个参考点。target=“_top” 这个属性设定链接被点击后，结果所要显示的视窗。 可选值为： _blank, _pa