《世上最全的html教案》由会员分享，可在线阅读，更多相关《世上最全的html教案（119页珍藏版）》请在金锄头文库上搜索。
1、1,一、HTML的概述,WWW（World Wide Web）万维网，是Internet的服务之一；是一个大规模的在线（On-line）信息集合，可以通过一种叫浏览器（Browser）的应用程序进行检索和查看。与WWW密切相关的一个概念就是浏览器（Browser），浏览器即进行网上浏览（冲浪）的应用程序；其主要作用是下载并且显示用户指定的网页及其解释脚本。浏览器的工作过程：用户连接到Internet在浏览器的地址栏输入一个Internet地址（URL-一个网页）按回车浏览器将此“请求”通过网络介质传送到页面所在的服务器（Server）服务器做出响应，将相应的页面发送给浏览器浏览器解释并显示页面
2、。,什么是W W W ?,2,HTML的英语意思是：Hypertext Marked Language，即超文本标记语言,是一种用来制作超文本文档的简单标记语言。超文本传输协议规定了浏览器在运行 HTML 文档时所遵循的规则和进行的操作.HTTP协议的制定使浏览器在运行超文本时有了统一的规则和标准.用HTML编写的超文本文档称为HTML文档，它能独立于各种操作系统平台，自1990年以来HTML就一直被用作（是World Wide Web的缩写，也可简写WEB、中文叫做万维网) 的信息表示语言，使用HTML语言描述的文件，需要通过WEB浏览器显示出效果。所谓超文本，是因为它可以加入图片、声音、动
3、画、影视等内容，HTML并不是一种程序语言，它只是一种排版网页中资料显示的结构语言，易学易懂，非常简单。HTML的普遍应用就是带来了超文本的技术-通过单击鼠标从一个主题跳转到另一个主题，与世界各地主机的文件链接。直接获取相关的主题。,什么是 HTML ?,3,二、 HTML的基本结构,一个HTML文档是由一系列的元素和标签组成.元素名不区分大小写.HTML用标签来规定元素的属性和它在文件中的位置， HTML超文本文档分文档头和文档体两部分，在文档头里，对这个文档进行了一些必要的定义，文档体中才是要显示的各种文档信息。,编写第一个HTML页面文件,4,网页标题这是网页主体,5,在文档的最外层，
4、文档中的所有文本和html标签都包含在其中，它表示该文档是以超文本标识语言（HTML）编写的。事实上，现在常用的Web浏览器都可以自动识别HTML文档，并不要求有 标签，也不对该标签进行任何操作，但是为了使HTML文档能够适应不断变化的Web浏览器，还是应该养成不省略这对标签的良好习惯。是HTML文档的头部标签, 在浏览器窗口中，头部信息是不被显示的,在此标签中可以插入其它标记, 用以说明文件的标题和整个文件的一些公公属性。若不需头部信息则可省略此标记，良好的习惯是不省略。和是嵌套在头部标签中的，标签之间的文本是文档标题，它被显示在浏览器窗口的标题栏。标记一般不省略，标签之间的文本是正文，是在
5、浏览器要显示的页面内容。上面的这几对标签在文档中都是唯一的，HEAD标签和BODY标签是嵌套在HTML标签中的。,6,第三章 页面的头部标记,HTML的头部标记是,主要包括页面的一些基本描述语句,用语包含当前文档的有关信息.一般来说,位于头部的内容不会在页面上直接显示. 1.常用的头部标记,7,2.标题标记,在HTML文档中, 标题文字位于和标记之间 和标记位于文档的头部, 也就是位于和标记之间,网页标题的作用:, 提示网页内容 浏览器保存网页时的默认文件名 浏览器收藏网页时的默认名字,基本语法:,语法解释:,标记内部就是标题的内容，即,见 文件范例3-1.htm,下一页,8,3.基底网址标记
6、,标记可以设定URL , 一般常用来设定浏览器中文件的绝对路径. 然后在文件中 只需写下相对路径,浏览时这些位置会自动的附在绝对路径的后面, 成为完整路径.,注意:, 文档中所有相对地址形式的URL都是相对于这里定义的URL而言的 一篇文档的标记不能多于一个, 必须放于头部,基本语法:,语法解释:,HREF属性指定了文档的基础URL地址 TARGET定义的是打开页面的窗口, 即窗口的打开方式,见 文件范例3-2.htm,下一页,9,4.元信息标记,标记通过属性来定义文件信息的名称、内容等.是实现元数据的主要标记.在HTML的头部可以包括任意数量的标记,标记的属性:,10,(1).设定自动刷新,
7、使用HTTP-EQUIV属性中的REFRESH能够设定页面的自动刷新,基本语法:,语法解释:,HTTP-EQUIV传送HTTP通讯协议的标头,REFRESH代表刷新,CONTENT中写下刷新间隔的秒数,见 文件范例3-8.htm,下一页,11,(2).设定自动跳转,使用HTTP-EQUIV属性中的REFRESH不仅能够完成页面的自动刷新,也可以实现页面之间的跳转过程. 页面跳转可以使当前页面等待几秒以后,自动跳转到新的网页,基本语法:,语法解释:,HTTP-EQUIV传送HTTP通讯协议的标头, REFRESH代表刷新,CONTENT中写下跳转间隔的秒数以及跳转之后打开的文件地址,见 文件范例
8、3-9-1.htm,下一页,12,(3).设定字符集,HTML页面能以不同的字符集来显示,如中国常用的GB码(简体中文),台湾地区常用的BIG5码(繁体),欧洲地区常用的ISO8859-1(英文)等.对于不同的字符集页面,如果用户的浏览器不能显示该字符,则浏览器中显示的都是乱码,这时就需要由HTML语言来定义页面的字符集,用以告知浏览器以对应的内码来显示页面内容,基本语法:,语法解释:,HTTP-EQUIV传送HTTP通讯协议的标头, CONTENT中定义页面的内码,其中CHARSET中写下内码的语系,见 文件范例3-7.htm,下一页,13,第四章 页面的主体标记,页面的主体部分位于和之间.
9、作为一个标记,有很多自身属性: 1.的属性,14,续上表,15,1.文字颜色属性 Text,元素的TEXT属性可以改变整个页面默认文字的颜色,如果没有对文字进行单独设定,这个属性将对页面中所有文字生效.,基本语法:,语法解释:,通过TEXT属性定义了文字颜色,COLOR_VALUE指颜色值,颜色值,颜色值可以使用英文名称或者十六进制值来表示,#000000,R,G,B,黑色,Black,16,颜色对照表,17,2.背景颜色属性 BgColor,元素的BgColor属性可以改变整个页面背景的颜色.,基本语法:,语法解释:,通过BgColor属性定义了文字颜色,COLOR_VALUE指颜色值,见
10、文件范例4-2.htm,下一页,18,4.背景图象属性 BACKGROUND,元素的BACKGROUND 属性将图片设定为页面背景.,基本语法:,语法解释:,通过BACKGROUND属性定义了页面背景,见 文件范例4-3-1.htm,下一页,19,5.背景图象固定属性 BGPROPERTIES,元素的BGPROPERTIES 属性将图片页面背景设定为固定.,基本语法:,语法解释:,通过BACKGROUND属性定义了页面背景, BGPROPERTIES设定了背景图象固定,见 文件范例4-4.htm,下一页,20,6.上边距属性TOPMARGIN,元素的TOPMARGIN 属性可以定义页面的上边距
11、.,基本语法:,语法解释:,通过TOPMARGIN属性定义页面的上边距,单位为像素,见 文件范例4-6.htm,下一页,21,6.左边距属性LEFTMARGIN,元素的LEFTMARGIN 属性可以定义页面的上边距.,基本语法:,语法解释:,通过LEFTMARGIN属性定义页面的左边距,单位为像素,见 文件范例4-7.htm,下一页,22,第五章 文字与段落,第一节 文字的内容,文字的内容编辑在和标记之间,1.输入普通文字,见 文件范例5-1.htm,下一页,23,2.输入空格符号,见 文件范例5-2.htm,5-2.htm,空格符号用 表示,3.输入其他特殊符号,见下一页详细列表,见
12、 文件范例5-3.htm,5-3.htm,24,特殊符号对照表,25,4.注释语句,基本语法:,注释的内容,见 文件范例5-4.htm,下一页,26,第五章 文字与段落,第二节 标题字标记,见 文件范例5-5.htm,下一页,1.标题字标记,基本语法:,文字,N为1-6间的数字,27,2.标题字的对齐属性,基本语法:,见 文件范例5-6.htm,下一页,28,第五章 文字与段落,第三节 文字的修饰标记,见 文件范例5-7.htm,下一页,1.粗体标记,基本语法:,文字,文字,29,2.斜体标记,基本语法:,文字,见 文件范例5-8.htm,下一页,文字,文字,30,3.上标标记,基本语法:,见
13、 文件范例5-9.htm,下一页,文字,31,4.下标标记,基本语法:,见 文件范例5-10.htm,下一页,文字,32,5.大字号标记,基本语法:,见 文件范例5-11.htm,下一页,文字,33,6.小字号标记,基本语法:,见 文件范例5-12.htm,下一页,文字,34,7.下划线标记,基本语法:,见 文件范例5-13.htm,下一页,文字,35,8.删除线标记,基本语法:,文字,见 文件范例5-14.htm,下一页,文字,36,9.地址文字标记,基本语法:,见 文件范例5-15.htm,下一页,文字,37,10.打字机文字标记,基本语法:,见 文件范例5-16.htm,下一页,文字,3
14、8,标记的属性,第四节 字体标记,39,1.字体属性FACE,基本语法:,见 文件范例5-20.htm,下一页,文字,不同的字体可以使用多次,之间用逗号隔开,如果第一种字体不存在,就按第二种字体显示,40,2.字号属性SIZE,基本语法:,见 文件范例5-21.htm,下一页,文字,字号范围为 1- 7 +1-+7-1- -7,41,3.颜色属性COLOR,基本语法:,见 文件范例5-22.htm,下一页,文字,42,4.基字标记BASEFONT,基本语法:,见 文件范例5-23.htm,下一页,基字标记BASEFONT的定义将影响到整个页面,43,第五节 段落标记,见 文件范例5-24.ht
15、m,下一页,1.段落标记,基本语法:,文字,文字,44,2.段落标记的对齐属性,基本语法:,文字,见 文件范例5-25.htm,下一页,文字,文字,45,3.换行标记,基本语法:,见 文件范例5-26.htm,下一页,46,4.不换行标记,基本语法:,见 文件范例5-27.htm,下一页,文字,47,5.预格式化标记,基本语法:,见 文件范例5-28.htm,下一页,文字,按代码原样显示,48,6.居中标记,基本语法:,见 文件范例5-29.htm,下一页,文字,49,7.缩排标记,基本语法:,见 文件范例5-30.htm,下一页,文字 blockquote ,50,第六节 水平线标记,见 文件范例5-31.htm,下一页,1.水平线标记,基本语法:,51,2.水平线宽度属性WIDTH,基本语法:,见 文件范例5-33.htm,下一页,基本语法:,3.水平线高度属性SIZE,见 文件范例5-32.htm,下一页,52,4.水平线去掉阴影属性NOSHADE,基本语法:,见 文件范例5-35.htm,下一页,基本语法:,5.水平线颜色属性COLOR,见 文件范例5-34.htm,下一页,53,6.水平线排列属性ALIGN,基本语法:,见 文件范例5-36.htm,下一页,54,第六章 列表的建立,第一节 关于列表,
