第一章 HTML概述与基本结构

三、 HTML的标签与属性:

第二章 HTML主体标签及属性、颜色的设定

第三章文字版面的编辑

第五章图像的处理

第六章建立超链接

第七章 TABLE表格

7-1 定义表格的基本语法

7-2表格标签属性

7-2（1) 表格

标签的常用属性

7-2（2）设置分隔线的显示状态 rules

7-2（3）表格的边框显示状态 frame

7-3 表格行的设定

7-4 单元格的设定

7-5 设定跨多行多列单元格

7-6 表格的分组

7-6-1 表格的行分组

//

7-6-2 表格按列分组

7-6-3 表格的行列分组

7-7 表格的标题标签

7-8 表格的嵌套

第八章网页的动态、多媒体效果

第十章表单的设计

HTML 教程第一章 HTML概述与基本结构 .....................................................................................................2 一、HTML的概述....................................................................................................................2 二、 HTML的基本结构：......................................................................................................2 三、 HTML的标签与属性: .....................................................................................................3 第二章 HTML主体标签及属性、颜色的设定......................................................................4 一、 html的主体标签 ...........................................................................................4 二、颜色的设定.....................................................................................................................5 第三章文字版面的编辑.................................................................................................................6 第四章建立列表 ..........................................................................................................................15 第五章图像的处理.......................................................................................................................21 第六章建立超链接.......................................................................................................................26 第七章 TABLE表格 ......................................................................................................................35 7-1 定义表格的基本语法 .....................................................................................................35 7-2 表格标签属性 ......................................................................................................36 7-2（1) 表格

标签的常用属性........................................................................36 7-2（2）设置分隔线的显示状态 rules......................................................................37 7-2（3）表格的边框显示状态 frame ........................................................................38 7-3 表格行的设定 .................................................................................................................39 7-4 单元格的设定 .................................................................................................................40 7-5 设定跨多行多列单元格 .................................................................................................42 7-6 表格的分组 .....................................................................................................................43 7-6-1 表格的行分组// .............................................................43 7-6-2 表格按列分组...................................................................................44 7-6-3 表格的行列分组 ..................................................................................................45 7-7 表格的标题标签

.............................................................................................45 7-8 表格的嵌套 .....................................................................................................................46 第八章网页的动态、多媒体效果.................................................................................................49 第九章多视窗口框架 ..................................................................................................................53 第十章表单的设计.........................................................................................................................59

第一章 HTML概述与基本结构一、HTML 的概述显 HTML的英语意思是：Hypertext Marked Language，即超文本标记语言,是一种用来制作超文本文档 HTTP 的简单标记语言。超文本传输协议规定了浏览器在运行 HTML 文档时所遵循的规则和进行的操作. 协议的制定使浏览器在运行超文本时有了统一的规则和标准.用HTML编写的超文本文档称为HTML文档，它能独立于各种操作系统平台，自 1990 年以来HTML就一直被用作ＷＷＷ（是World Wide Web的缩写，也可简写WEB、中文叫做万维网) 的信息表示语言，使用HTML语言描述的文件，需要通过WEB浏览器示出效果。所谓超文本，是因为它可以加入图片、声音、动画、影视等内容，事实上每一个 HTML 文档都是一种静态的网页文件，这个文件里面包含了 HTML 指令代码，这些指令代码并不是一种程序语言，它只是一种排版网页中资料显示位置的标记结构语言，易学易懂，非常简单。HTML 的普遍应用就是带来了超文本的技术----通过单击鼠标从一个主题跳转到另一个主题，从一个页面跳转到另一个页面与世界各地主机的文件链接。直接获取相关的主题。如下所示：通过 HTML 可以表现出丰富多彩的设计风格：图片调用：

文字格式：文字通过 HTML 可以实现页面之间的跳转：页面跳转：〈A HREF="文件路径/文件名"> 通过 HTML 可以展现多媒体的效果：声频：

视频：

从上面我们可以看到HTML超文本文件时需要用到的一些标签。在HTML中每个用来作标签的符号都是一条命令、它告诉浏览器如何显示文本。这些标签均由"<"和">"符号以及一个字符串组成。而浏览器的功能是对这些标记进行解释，显示出文字、图像、动画、播放声音。这些标签符号用“<标签名字属性>”来表示。 HTML 只是一个纯文本文件。创建一个 HTML 文档，只需要两个工具，一个是 HTML 编辑器，一个 WEB 浏览器。HTML 编辑器是用于生成和保存 THML 文档的应用程序。WEB 浏览器是用来打开 WEB 网页文件，提供给我们查看 WEB 资源的客户端程序。二、 HTML 的基本结构：一个 HTML 文档是由一系列的元素和标签组成.元素名不区分大小写.HTML 用标签来规定元素的属性和它在文件中的位置， HTML 超文本文档分文档头和文档体两部分，在文档头里，对这个文档进行了一些必要的定义，文档体中才是要显示的各种文档信息。下面是一个最基本的html文档的代码:1－1.html ---------------------------------------- 开始标签 --------------------------------------| 头部标签

一个简单的 HTML 示例 -------------------------------------- ---------------------------------------- | 文件主体 |

欢迎光临我的主页

|
|

| 这是我第一次做主页 | | | --------------------------------------- --------------------------------------- 结尾标签在文档的最外层，文档中的所有文本和 html 标签都包含在其中，它表示该文档是以超文本标识语言（HTML）编写的。事实上，现在常用的 Web 浏览器都可以自动识别 HTML 文档，并不要求有标签，也不对该标签进行任何操作，但是为了使 HTML 文档能够适应不断变化的 Web 浏览器，还是应该养成不省略这对标签的良好习惯。是HTML文档的头部标签, 在浏览器窗口中，头部信息是不被显示在正文中的,在此标签中可以插入其它标记, 用以说明文件的标题和整个文件的一些公共属性。若不需头部信息则可省略此标记，良好的习惯是不省略。和是嵌套在头部标签中的，标签之间的文本是文档标题，它被显示在浏览器窗口的标题栏。标记一般不省略，标签之间的文本是正文，是在浏览器要显示的页面内容。上面的这几对标签在文档中都是唯一的，HEAD 标签和 BODY 标签是嵌套在 HTML 标签中的。三、 HTML的标签与属性: 对于刚刚接触超文本的朋友，遇到的最大的障碍就是一些用“<”和 “>”括起来的句子，我们称它为标签，是用来分割和标签文本的元素，以形成文本的布局、文字的格式及五彩缤纷的画面。标签通过指定某块信息为段落或标题等来标识文档某个部件。属性是标志里的参数的选项， HTML 的标签分单标签和成对标签两种。成对标签是由首标签<标签名> 和尾标签组成的，成对标签的作用域只作用于这对标签中的文档。单独标签的格式<标签名>，单独标签在相应的位置插入元素就可以了，大多数标签都有自己的一些属性, 属性要写在始标签内，属性用于进一步改变显示的效果, 各属性之间无先后次序，属性是可选的，属性也可以省略而采用默认值;其格式如下： <标签名字属性 1 属性 2 属性 3 … >内容作为一般的原则，大多数属性值不用加双引号。但是包括空格、％号，＃号等特殊字符的属性值必须加入双引号。为了好的习惯，提倡全部对属性值加双引号。如：字体设置注意事项：输入始标签时，一定不要在“<”与标签名之间输入多余的空格，也不能在中文输入法状态下输入这些标签及属性，否则浏览器将不能正确的识别括号中的标志命令，从而无法正确的显示你的信息。

第二章 HTML主体标签及属性、颜色的设定为了使你的网页绚丽多姿，吸引更多的浏览者阅读，可以给网页添加更多的标签及属性，这是为了对网页中的元素进行修饰、布局。下面就来逐一介绍这些标签。一、 html 的主体标签在和中放置的是页面中所有的内容，如图片、文字、表格、表单、超链接等设置。标签有自己的属性，设置标签内的属性，可控制整个页面的显示方式。标签的属性属性描述 link alink vlink 设定页面默认的连接颜色设定鼠标正在单击时的连接颜色设定访问后连接文字的颜色 background 设定页面背景图像 bgcolor 设定页面背景颜色 leftmargin 设定页面的左边距 topmargin 设定页面的上边距 bgproperties 设定页面背景图像为固定，不随页面的滚动而滚动 text 设定页面文字的颜色格式：实例：2-1.html bady 的属性实例

设定不同的连接颜色

测试 body 标签

默认的连接颜色

正在按下的连接颜色,

访问过后的连接颜色,

返回实例说明：的属性设定了页面的背景颜色，文字的颜色，链接的颜色为 #3300ff，单击的连接颜色为#ff00ff，单击过后的颜色为#9900ff。 Body 里面的是页面中的链接标签，对于属性可根据页面的效果来定，用那个属性就设定那个属性。对于上面的属性在后面的章节中还会介绍，在这里就不逐一引用了，我们的学习目的主要是掌握标签及属性的使用方法。二、颜色的设定颜色值是一个关键字或一个 RGB 格式的数字。在网页中用得很多，在此就先介绍一下。颜色是由 "red" "green" "blue " 三原色组合而成的，在 HTML 中对颜色的定义是用十六进位的，对於三原色 HTML 分别给予两个十六进位去定义，也就是每个原色可有 256 种彩度，故此三原色可混合成 16777216 种颜色。例如：白色的组成是 red=ff, green=ff, blue= ff,RGB 值即为 ffffff 红色的组成是 red=ff, green= 00, blue= 00, RGB 值即为 ff0000 绿色的组成是 red=00, green=ff, blue= 00, RGB 值即为 00ff00 蓝色的组成是 red=00, green= 00, blue= ff, RGB 值即为 0000ff 黑色的组成是 red=00, green=00, blue=00, RGB 值即为 000000 应用时常在每个 RGB 值之前加上“ # “ 符号，如：bgcolor="#336699" 用英文名字表示颜色时直接写名字。如 bgcolor=green RGB 颜色可以有四种表达形式:： #rrggbb (如，#00cc00) #rgb (如，#0c0) rgb(x,x,x) x 是一个介乎 0 到 255 之间的整数 (如，rgb(0,204,0)) rgb(y%,y%,y%) y 是一个介乎 0.0 到 100.0 之间的整数 (如， rgb(0%,80%,0%) Windows VGA(视频图像阵列)形成了 16 各关键字: aqua，black， blue，fuchsia, gray，green， lime，maroon，navy，olive， purple，red，silver，teal，white，and yellow 下面是部分颜色的 RGB 代码图表: • • • •

第三章文字版面的编辑 3-1 换行标签
换行标签是个单标签，也叫空标签，不包含任和内容，在 html 文件中的任何位置只要使用了
标签，当文件显示在浏览器中时，该标签之后的内容将显示下一行。请看下面的例子：3-1html 无换行示例无换行标记：登鹳雀楼白日依山尽，黄河入海流。欲穷千里目，更上一层楼。
有换行标记：
登鹳雀楼
白日依山尽，
黄河入海流。
欲穷千里目，
更上一层楼。 3-2 换段落标签

及属性：由

标签所标识的文字，代表同一个段落的文字。不同段落间的间距等于连续加了两个换行符，也就是要隔一行空白行，用以区别文字的不同段落。它可以单独使用，也可以成对使用。单独使用时，下一个

的开始就意味着上一个

的结束。良好的习惯是成对使用。格式：

其中,ALIGN 是

标签的属性,属性有三个参数 left,center,right.这三个参数设置段落文字的左,中,右位置的对齐方式. 实例:3-2html 测试分段控制标签

花儿什么也没有。它们只有凋谢在风中的轻微、凄楚而又无奈的吟怨，就像那受到了致命伤害的秋雁，悲哀无助地发出一声声垂死的鸣叫。

或许，这便是花儿那短暂一生最凄凉、最伤感的归宿。

而美丽苦短的花期

却是那最后悲伤的秋风挽歌中的瞬间插曲。

3-3 原样显示文字标签

   

    要保留原始文字排版的格式,就可以通过标签来实现,方法是把制作好的文字排版内容前后分别
加上始标签和尾标签. 
实例:3-3html 
 
 
原样显示文字标签 
 
 
 
     白日依山尽， 
          黄河入海流。 
                欲穷千里目， 
                      更上一层楼。 
 
 
 

3-4  居中对齐标签   

    文本在页面中使用标签进行居中显示,是成对标签,在需要居中的内容部分开头处
加,结尾处加 
 实例：3-4html 
 
 
居中对齐标签 
 
 
 
《送孟浩然之廣陵》 
故人西辭黃鶴樓， 
煙花三月下揚州。 
孤帆遠影碧山盡， 
惟見長江天際流。 
 
 
 

3-5  引文标签  (缩排标签）   

     标签可以用来建立一个引文，他特别适合较长文本的引用，引文显示时将会自动右移，
左边空出几个格，加以区别。 
实例：3-5html

引文标签春

 
 
盼望着，盼望着，东风来了，春天脚步近了。
 
一切都像刚睡醒的样子，欣欣然张开了眼。山朗润起来了，水涨起来了，太阳的脸红起来了。 

小草偷偷地从土里钻出来，嫩嫩的，绿绿的。园子里，田野里，瞧去一大片一大片满是的。坐着，躺着，
打两个滚，踢几脚球,赛几趟跑，捉几 
回迷藏。风轻悄悄的，草软绵绵的。 
 
 

桃树、杏树、梨树，你不让我，我不让你，都开满了花赶趟儿。红的像火，粉的像霞，白的像雪。花里带
着甜味儿；闭了眼，村上仿佛已 

经满是桃儿、杏儿、梨儿。花下成千成百的蜜蜂嗡嗡地闹着，大小的蝴蝶飞来飞去。野花遍地是：杂样儿，
有名字的，没名字的，散在草 
丛里像眼睛，像星星，还眨呀眨的。 
“吹面不寒杨柳风”，不错的，像母亲的手抚摸着你。风里带来些新翻的泥土的气息，混着青草味儿，还有
各种花的香，都在微微润湿的 

空气里酝酿。鸟儿将巢安在繁花嫩叶当中，高兴起来了，呼朋引伴地卖弄清脆的喉咙，唱出宛转的曲子，
跟轻风流水应和着。牛背上牧童 
的短笛，这时候也成天嘹亮地响着。 

雨是最寻常的，一下就是三两天。可别恼。看，像牛毛，像花针，像细丝，密密地斜织着，人家屋顶上全
笼着一层薄烟。树叶儿却绿得发 

亮。小草儿也青得逼你的眼。傍晚时候，上灯了，一点点黄晕的光，烘托出一片安静而和平的夜。在乡下，
小路上，石桥边，有撑着伞慢 
慢走着的人；地里还有工作的农民，披着蓑戴着笠。他们的房屋，稀稀疏疏的，在雨里静默着。 
 
 

天上风筝渐渐多了，地上孩子也多了。城里乡下，家家户户，老老小小，也都赶趟儿似的，一个个都出来
了。舒活舒活筋骨，抖擞 
抖擞精神，各做各的一份事儿去。 
“一年之计在于春”，刚起头儿，有的是工夫，有的是希望。 
春天像刚落地的娃娃，从头到脚都是新的，它生长着。 
春天像小姑娘，花枝招展的，笑着，走着。 
春天像健壮的青年，有铁一般的胳膊和腰脚，他领着我们上前去。

3-6 水平分隔线标签

标签是单独使用的标签，是水平线标签，用于段落与段落之间的分隔，使文档结构清晰明了，使

分享到：

赞收藏

资料库

HTML语言教程（完整版）.pdf

欢迎光临我的主页

设定不同的连接颜色

相关推荐

开发技术

热门标签

最新资料