第一讲HTML的基础知识

第一讲HTML的基础知识教学目标：初步认识HTML标识语言并且能够了解它在网页制作过程中的作用，掌握基本的标签代码教学重、难点：认识并且能够运用所学的标签代码网页是由HTML标记语言代码构成的程序文件。虽然现在我们可以利用Dreamweaver等可视化工具方便、直观地设计制作网页，生成网页文件，不需要再去编写烦琐的网页代码，但是对HTML语言有一个初步的了解、能够帮助我们理解网页的制作原理和运行机制，分析和借鉴其他网页的元素，以及创建在可视化环境下难以实现的效果。1.HTML基本概念（1）HTML的概念HTML是一种描述语言，对web页面中显示内容的属性以标签的形式进行描述。客户机上的浏览器(browser)对这些描述进行解释后将相应页面内容正确地显示在显示器上。一个web页面就是一个HTML文档。（2）HTML文档的构成HTML文档由三大元素构成：HTML元素、HEAD元素和BODY元素。每个元素又包含各自相应的标记（属性）。HTML元素是最外层的元素，里面包含HEAD元素和BODY元素。HEAD元素中包含对文档基本信息（文档标题、文档搜索关键字、文档生成器等）描述的标记。BODY元素是文档的主体部分，包含有对网页元素（文本、表格、图片、动画、链接等）描述的标记。HTML中标记一般成对，如：P和/P、HTML和/HTML等，但是有一些不成对。HTML文档的结构形式如下：HTMLVERSION=-//W3C//DTDHTML3.2FINAL//ENHEAD页面信息的描述title标题信息/title/HEADBODY页面元素的描述/BODY/HTML3）HTML文档的编辑HTML文档是普通文本（ASCII）文件，它可以用任意编辑器（如Windows的记事本、写字板等）生成。早期的网页制作的过程就是直接书写HTML代码来定义页面元素的过程。HTML文档制作完成后，应该将其放在Web服务器上，供客户端浏览器下载、浏览。如果你所在的单位有Web服务器，可以和Web服务器管理员联系，看看如何把你的文件放到Web服务器上。否则，可以通过免费主页空间把你的文件放到别人的Web服务器上。HTML的语法是通过标记来体现的，不同的标记符号以及其属性构成了该语言的语法特征。下面我们通过三大元素中的标记来描述HTML的语法结构。1.HTML元素的标记HTML标记是对整个文档属性的描述，即告诉浏览器HTML文档的开始和结束，是网页中最外层的标记。由HTML和/HTML标记对标出。HTML只有HTML一个标记。2.HEAD元素（1）HEAD标记。该标记用来表示HEAD元素的开始和结束，其格式为：HEAD/HEAD。（2）BASE标记（不成对标记）。BASE标记用来确定当前初始的URL，当前文件中的链接都以所定义的初始地址为基础。它有一个HREF属性，其值为所定义的基准URL地址，格式为：BASEHREF=上面格式标志着文档中的相对链接都以为基础地址。页面中到达相对路径index.htm的链接就会被浏览器自动解释为绝对路径。（3）META标记（不成对标记）。该标记通过一些属性的设置，向浏览器传递一些页面参数。如：浏览器用什么字符集对文件进行解码、搜索引擎关键字、文档生成器等。常见的属性格式为：1）METAHTTP-EQUIV=GENERATORCONTENT=DREAMWEAVER//服务器向客户发送一个报头：GENERATOR:DREAMWEAVER(生成器DREAMWEAVER)2）metaname=keywordscontent=dreamweaver,html//服务器向搜索引擎发送一个搜索关键字（keywords）:dreamweaver3）metahttp-equiv=content-typecontent=text/htmlcharset=gb2312//服务器向客户端浏览器发送的信息为：文本形式：超文本，解码方式：简体中文（4）title标记（5）script标记3.BODY元素（可见对象的描述）（1）body标记和脚本语言标记script/script（2）div层标记div/div（3）文本标记font/font（4）段落标记p/p,br（5）表格标记tabletrtd/td/tr/table（6）图象标记imgsrc=“”（7）下拉列表标记formselectoption/option/select/form（8）链接标记ahref=“”/a（9）多媒体标记A.背景音乐标记bgsoundsrc=loop=循环的次数B.视频剪辑标记：imgsrc=url.gifdynsrc=url.aviurl.avi表示用来播放的视频文件（包括相对地址和文件名）url.gif表示视频文件的封面，即：在浏览器尚未完全读入avi文件时，先在avi播放域中显示该图象。C.视频播放时间控制：imgstart=Fileopen或mouseoverFileopen表示页面打开即开始播放；mouseover表示把鼠标移动到AVI区域时才开始播放。D.视频播放控制条显示标记:imgcontrols。如：imgsrc=sample.gifdynsrc=sample.avicontrolsE.视频播放循环次数标记：imgloop=nn为数字。imgloop=infinite将循环播放不止。如：imgsrc=sample.gifdysrc=sample.avicontrolsloop=3（10）滚动文字标记marquee/marquee（11）水平线标记hrcolor=“”上机任务:利用所学的HTML知识完成一张页面