HTML入门教程.doc

HTML语言入门 第一课 基础当我们畅游Internet时，我们透过浏览器所看到的网站，是由HTML (HyperText Markup Language) 语言所构成。HTML ( 超文件标记语言 ) 是一种建立网页文件的语言，透过标记式的指令 (Tag)，将影像、声音、图片、文字等连结显示出来。 HTML标记是由 所括住的指令，主要分为 : 单标记指令、双标记指令 ( 由 ，所构成 ) 。HTML网页文件可由任何文本编辑器或网页专用编辑器编辑，完成后 ( 以 .htm 或 .html 为文件后缀保存 ) 将HTML网页文件由浏览器打开显示，若测试没有问题则可以放到服务器 (Server) 上，对外发布信息。HTML文件基本架构 文件开始 标头区开始. 标题区 标头区结束 本文区开始本文区内容 本文区结束 文件结束 网页文件格式。 标头区 : 记录文件基本资料，如作者、编写时间。 标题区 : 文件标题须使用在标头区内，可以在浏览器最上面看到标题。 本文区 : 文件资料，即在浏览器上看到的网站内容。注意事项 通常一份HTML网页文件包含二个部份 : . 标头区、 . 本文区。而 和 代表网页文件格式。 习惯上一个网站的首页名称通常订为 index.htm 或 index.html 这样只要浏览网站，浏览器便会自动的找出 index.htm 文件。 第二课 字体我们在这里将要谈的是有关文字的标记，包括字体大小、颜色、字型.等变化，适当的应用可以增加页面的美观！ 常用字体标记 . 标题，设定标题字体大小， n = 1 ( 大 ) 6 ( 小 ) 会自动跳下一行。通常用在如章节、段落等标题上。 如 : 标题 标题如 : 标题 ( 标题置中 ) 标题. 粗体字。 如 : 粗体字 粗体字 . 斜体字。 如 : 斜体字 斜体字 . 加底线。 如 : 加底线 加底线 . 横线 ( 表示删除 )。 如 : 横线 . 打字体 ( 固定宽度文字 )。 如 : 打字体 打字体 . 上标字。 如 : 字体 上标字 字体上标字 . 下标字。 如 : 字体 下标字 字体下标字 注解 ( 不会显示在浏览器上 )，可以多行。 如 : 设定字体大小、颜色、字型有关设定文字的方法共有以下几种 : 1.设定HTML文件主体文字颜色。.标记。 如 : . 或. 2.设定基本字体大小、颜色、字型。.标记。 3.设定字体大小、颜色、字型。.标记。 . 设定基本字体，SIZE = 1 7，1 ( 最小 ) 7 ( 最大 )。 如 : 基本字体大小为 4 基本字体大小为 4 如 : 设定颜色 设定颜色 如 : 设定字型 设定字型 . 基本字体加大。 如 : 基本字体大小为 4， 加大为 5 基本字体大小为 4，加大为 5 . 基本字体减小。 如 : 基本字体大小为 4， 减小为 3 基本字体大小为 4，减小为 3 . 设定字体大小、颜色、字型，SIZE = 1 7，1 ( 最小 ) 7 ( 最大 )。 如 : 字体大小为 4 字体大小为 4 如 : 基本字体大小为 4 +1字体大小为 5 -2字体大小为 2 .基本字体大小为 4 +1字体大小为 5-2字体大小为 2如 : 设定颜色 设定颜色 如 : 设定字型 设定字型 注意事项1. 设定字体的大小分 : 绝对SIZE 如 : 和 相对SIZE 如 : ( 以 BASEFONT 设定的字体大小做加减 )。 2. 设定字体的颜色可以是颜色名称或#RRGGBB表红绿蓝强度 ( 00 暗 FF 亮 )。 #RRGGBB 所代表的是红、绿、蓝三原色，每一色由两位十六进制的数值表示 ( 即十进制 0 255 )。十六进制 : 0、1、2、3、4、5、6、7、8、9、A、B、C、D、E、F。 3. 设定字体的字型会按照顺序找出显示的字型，若找不到则以系统预设字型显示第三课 表格表格是HTML的一项非常重要功能，利用其多种属性能够设计出多样化的表格。使用表格可以使你的页面有很多意想不到的效果，使页面更加整齐美观。 常用表格标记 . 表格指令。 相关属性 : ALIGN 调整BGCOLOR 背景颜色BORDER 边框HEIGHT 高度WIDTH 宽度 . 表格标题。 相关属性 : ALIGN 调整 . 表格列 ( 可省略 ) 。 相关属性 : ALIGN 调整 . 表格栏标题 ( 表头 ) 粗体字 ( 可省略 ) 。 相关属性 : ALIGN 调整COLSPAN 栏宽ROWSPAN 栏高 . 表格栏资料 ( 储存格 ) ( 可省略 ) 。 相关属性 : ALIGN 调整BGCOLOR 背景颜色HEIGHT 高度WIDTH 宽度COLSPAN 栏宽ROWSPAN 栏高 举例 如 : ( 基础型 ) 太平洋网络学院太平洋网络学院太平洋网络学院太平洋网络学院太平洋网络学院 太平洋网络学院 太平洋网络学院 太平洋网络学院 如 : ( 加强型 ) 增加背景颜色、表格标题、栏标题、跨栏宽、跨栏高。 表格标题行标题 1 行标题 2列标题 1 A A A AB B B B列标题 2 C C C CD D D D 表格标题行标题 1 行标题 2 列标题 1 A A A A B B B B 列标题 2 C C C C D D D D 看了以上的例子，应该了解表格的基本写法吧！ 第四课 标示HTML提供许多种类的标示标记，作项目标示，而且可以作巢状式标示！ 常用标示标记 标示项目。 如 : 第一项第二项1. 第一项 2. 第二项 . 编号标示，可标示数字或英文、罗马字母。 如 : 第一项第二项I. 第一项 II. 第二项 . 符号标示，可标示数字或英文、罗马字母。 如 : 第一项第二项 第一项 第二项 定义项目。 定义资料。 . 定义标示。 如 : 十进制 :0、1、2、3、4、5、6、7、8、9十六进制 :0、1、2、3、4、5、6、7、8、9、A、B、C、D、E、F十进制 : 0、1、2、3、4、5、6、7、8、9 十六进制 : 0、1、2、3、4、5、6、7、8、9、A、B、C、D、E、F 巢状式标示 如 : 第一章 第一节 第一段 第二段 第二节 第二章第三章1. 第一章 i. 第一节 第一段 第二段 ii. 第二节 2. 第二章 3. 第三章 其他标示标记. 目录式标示 ( 自动加圆点 )。 如 : 网络学院 :新手上路软件教室设计教室开发教室 网络学院 : 新手上路 软件教室 设计教室 开发教室 注意事项标示项目符号也可以用. 标记，以符号字元 ( 、.等 ) 标示。如 : 特殊符号 :在HTML文件中，有些符号是代表特定的意义的。所以当我们要使用这些特殊符号时，便要用替代指令。 符号 替代指令 charset=gb2312 设定十秒回到首页。 ( 若不设定HTML文件位置则再载入原HTML文件 ) 设定链接、未链接部份颜色 设定链接、未链接部份颜色，用.标记。 相关属性 : ALINK按下链接部份未放开时颜色 LINK未看过的链接部份颜色 VLINK已看过的链接部份颜色 如 : 第七课 框架框架架构的标记，主要是分割窗口和插入浮动窗口的功能。如果能有效的运用将有助于浏览网页的效率！ 常用窗口标记 . 定义分割窗口。 相关属性 : BORDER 边框COLS 行 , 设定分割左右窗口宽度 ( 用,分隔，可设百分比 % ;*表示剩余部份 )FRAMEBORDER 显示边框ROWS 列 , 设定分割上下窗口高度 ( 用,分隔，可设百分比 % ;*表示剩余部份 ) 定义窗口。 相关属性 : FRAMEBORDER 显示边框NAME 名称 NORESIZE 设定是否可以调整窗口大小SRC 文件或URL位址SCROLLING 设定是否可以卷动 . 无支援分割窗口浏览器显示文字。 . 插入浮动窗口。 相关属性 : BORDER 边框FRAMEBORDER 显示边框NORESIZE 设定是否可以调整窗口大小SRC 文件或URL位址SCROLLING 设定是否可以卷动 举例 如 : 本站窗口架构。( 先分割成上下窗口，再于窗口各分割成左右窗口。 ) 如 : 浮动窗口 注意窗口基本架构的文件，通常放在HTML文件的第一页，如 : index.htm 。此HTML文件的基本架构并不需要本文区 ( BODY )，只需定义窗口架构，而其他HTML文件可用连结方式 ( A HREF=.连结标记 TARGET属性 ) 显示于指定的窗口中。 第八课 设置图片现在的网站没有用图片的，几乎很少了吧！图片增加了网站版面的美观，不过也不要放了大量的图片，而拖慢网站传输的效率喔！ 有关设定图片的方法共有以下几种 : 1. 设定HTML文件背景图片、背景颜色。.标记。如 : . 或. 2. 设定图片。标记。 3. 设定地图。.标记。 常用图片标记 指令 相关属性 : ALIGN 调整ALT 提示字BORDER 边框HEIGHT 高度SRC 文件或URL位址USEMAP 地图名称WIDTH 宽度 如 : 可插入图片 ( GIF、JPG格式 )、AVI电影. 地图 相关属性 : NAME 名称 设定地图动作区域 相关属性 : COORDS 设定动作区域座标 ( 左上角座标 : X1,Y1 ; 右下角座标 : X2,Y2 )HREF 动作区域连结点 ( 可载入位址或文件 )NOHREF 动作区域连结点不动作SHAPE 外型 举例设定地图 第九课 加入声音HTML不仅能插入图片，也可以载入MIDI音乐、WAV 音效喔！ 常用音乐标记 背景音乐、音效。 相关属性 : LOOP 循环 , 背景音乐播放次数SRC 文件或URL位址 (可为WAV、MIDI格式 ) 如 : 内嵌音乐插件 . 内嵌插件。 相关属性 : HEIGHT 高度WIDTH 宽度 ( 可设百分比% )SRC 设定内嵌物件的 URL 位址LOOP 循环 , 背景音乐播放次数AUTOSTART 自动播放 如 : 第十课 滚动条这是由IE提供的滚动条，可不要被众多的属性吓到了，越多的属性功能越强喔！ 【文字卷动标记】 . 文字卷动 ( 滚动条 )。【相关属性】 BEHAVIOR = 设定卷动方式- ALTERNATE 交替来回卷动- SCROLL 卷动 ( 预设 )- SLIDE 滑