实用现代教育技术学习文件.pptVIP

HTML语言 教学目标 1．熟悉HTML标记语言的基础知识 2．熟悉HTML语法基础 3．掌握文本格式相关标记的使用 4．掌握有序列表和无序列表的设置与使用 5．掌握表格的设置及表格的使用 6．掌握表单及表单控件的使用 7．掌握超链接的类型和超链接的设置 8．熟悉图像、音乐及滚动字幕的插入与设置 9．熟悉框架的使用 10．熟练地利用标记编写页面代码 本讲内容 HTML基础 文本格式标记 列表标记 多媒体元素标记 超链接标记 表格标记 表单标记 框架标记 CSS样式 案例解析 HTML基础 本章的引例是利用HTML标记实现的，本节首先介绍HTML基础知识。 HTML是Hypertext Markup Language的英文缩写，中文意思为超文本标记语言。 HTML基础 一、 基本概念 超文本（Hypertext）：被定义了某些特征的普通文本。 HTML标记（Markup）：用于标识页面中各部分的符号。在HTML中每个用来作标记的符号都是一条命令，它告诉浏览器如何显示信息。所有的标记都必须用尖括号（即 ）括起来。 HTML基础 一、 基本概念 (续) HTML标记的属性：大多数标记都拥有一个属性集，通过这些属性可以对作用的内容进行更多的控制。 HTML语言（Language）：即超文本标记语言，在HTML文档中，以超文本格式，利用标记及其属性进行网页设计的语言，它有自己特定的语法规则。 HTML文档：即页面，它是文本文档，其扩展名为.htm或.html。 HTML基础 二、HTML文档的基本结构 1．HTML结构标记 HTML文档都是由HTML标记构成的，一个基本的HTML文档通常包括以下三对顶级标记。 (1)HTML标记html…/html (2)头部标记head…/head (3)主体标记body…/body (1)HTML标记 html…/html 一个HTML文件总是以html标记开始，以/html标记结束，其它所有的标记都包含在它们之间。 此标记一般无需设置属性 (2)头部标记 head…/head 网页一般分头部和主体两部分。Head标记用于定义网页头部内容。 一般用来放置页面相关信息，如网页名称（标题）、页面版权等信息 也常用来放置脚本代码，如自定义函数等等。 (3)主体标记 body…/body 网页主体标记。进行网页设计时，文本、图形等各种标记就加入在body和/body之间 Body标记有许多属性。常用的有： Background：指定文档背景图像 Bgcolor：指定文档背景颜色 HTML基础 使用标记或标记属性时应注意以下几点： ① 属性一定要包含在标记中。 ② 一个标记中可以包含多个属性，属性之间至少用一个空格隔开。 ③ 属性值可以用双引号括起来，也可以省略双引号。 ④ 颜色属性值的表示方法有两种：一种是使用英文颜色单词表示，如red、blue等；另一种是使用六位十六进制数值格式#rrggbb表示，其中rr、gg和bb分别表示红、绿、蓝三基色的两位十六进制数据。 ⑤ 多个标记可以写在同一行 部分常见颜色表 颜色值 颜色名 颜色值 颜色名 #00FFFF aqua?? #808080 gray #000080 navy?? #C0C0C0 silver #000000 black?? #008000 green #808000 olive?? #008080 teal #0000FF blue?? #00FF00 lime #800080 purple?? #FFFF00 yellow #FF00FF fuchsia? ?#800000 maroon #FF0000 red?? #FFFFFF white HTML基础 2．HTML文档的基本结构 html head title……/title /head body …… /body /html 2.2 文本格式标记 文本是页面上出现较多的信息，利用HTML标记可以设置文本，以满足用户要求。 2.2.1 标题标记 标题标记的作用是设置文档的各级标题。标题标记为hn…/hn，其中n的取值是1~6，h1…/h1定义一级标题，字体最大；h6…/h6定义六级标题，字体最小。标题标记的常用属性是align，用于定义标题的对齐方式。 (取值有4种：left、right