广西政法管理干部学院信息工程系1HTML语言与网页设计101.PPT

第10章 HTML语言与网页设计 10.1 HTML简介 10.2 HTML基本标记 10.3 图片 10.4 超链接 10.5 表格和框架 10.6 在网页中添加多媒体 10.7 表单的应用 10.8 层叠样式表CSS和DIV标记 10.9 动态网页制作——JavaScript和VBScript 10.10 网页的制作与发布 10.1 HTML简介 HTML（Hyper Text Markup Language，超文本标记语言）是一种专门用于编写网页源代码的计算机语言。使用HTML可编制出各种各样的网页文件，HTML文件的扩展名是.htm或.html。 10.1.1 概述 HTML是纯文本类型的语言，使用HTML编写的网页文件也是标准的纯文本文件。在用浏览器打开某网页时，通过相应的查看“源文件”命令，可查看该网页的HTML源代码。 对于HTML文件，通过超文本传输协议（Hyper Text Transfer Protocol，HTTP），使信息能在Internet上做动态、交互、跨平台的流通。它使用的媒体可以是文字、声音、图片、动画等等。在HTML中，声音、图片必须用其他软件进行制作，然后用HTML的相应标记编排在网页的源代码中，浏览器才能解读这些声音、图片源文件，并且在用户屏幕上展示其实际效果。 在HTML中所用的标记都是以“”和“”一对符号来标识。在“”符号的右边不能紧接着空格，在“”符号的左边一般不要直接有空格。在浏览器中，所有标记（包括“ ”及位于其中的文字）都不会被显示出来。 HTML的语法有三种表达方式，具体如下： 元素名内容/元素名 元素名 属性名1=属性值1 属性名2=属性值2 …内容/元素名 元素名 一个典型的元素由三部分组成：一个开始标记、内容、一个结束标记。 HTML的语法表达方式中的元素名是该元素的开始标记，/元素名是该元素的结束标记。 通常，结束标记是由在相应的开始标记的元素名前面添加一个斜杠“/”而成。开始标记与结束标记一般是成对出现的，但也有一些元素是仅有开始标记而没有结束标记。如 br、hr等等。另外，一些元素可以同时使用开始标记和结束标记，也可以只使用开始标记而省略结束标记，如P元素，可只使用其开始标记p，省略其结束标记/p。 元素可能有相关的特性，叫做属性。元素的属性应出现在该元素开始标记的元素名之后及最后的“”之前，元素名与属性之间用空格分隔开。属性一般都有其属性值，通常每个属性均以“属性名＝”属性值形式成对出现。属性值应当被包含在英文的直双引号（ ）内而不是在中文双引号（“ ”）中。然而，如果属性值只包含字母（A～Z，a～z），数字（0～9），连字符（-），可省略直双引号。通常，在URL地址两边加上直双引号，以确保它们不会被Web服务器错误解释。 一些元素可以带有不止一个的属性，即是说，在元素开始标记中可以使用一系列的属性，元素名与属性之间、属性与属性之间均用空格分隔开。属性之间可以以任何次序出现。 10.1.2 HTML文件的基本结构 一个HTML 文件必须以html标记开始，并以/html标记结束。 HTML文件是层次结构文件，它依次分为文件头和文件体两部分。文件头部包含与文件有关的信息，文件体部包含全部正文信息。文件头部由head标记与/head标记所指定，文件头部是可选的，即是说，在一个HTML源文件中，文件头部可有可无。文件体部由body标记与/body标记所指定。 html和/html标记用于表示一个HTML文件的开始和结束。 head和/head标记用于表示一个HTML文件头部的开始和结束。 title和/title标记用于表示一个HTML文件标题的开始和结束。 body和/body标记用于表示一个HTML 文件体部的开始和结束。 p标记是用于段落分隔。 !-- 注释文本 --是注释标记的格式。 HTML语言是大小写无关的，故html与Html或HtMl都是一样的。同理，title与Title或TiTle也都是一样的。 10.2 HTML基本标记 10.2.1 背景与文本颜色设置 在HTML文档中，使用body元素的标记可以设置网页页面背景与文本的颜色。具体来说，在body元素的开始标记body中，使用某些关系到页面全局的属性，可以控制页面的背景与文本颜色。 body标记中不带任何属性时，表示全使用默认的属性值。 带有部分属性的body标记的格式如下： body bgcolor＝black background=//images/logosmall.gif text＝blue link＝red alink＝red vlink＝yellow 表10-1 设置背景与文本颜色的常用属性 表10-2 常用的16种颜色名与颜色值 10.2.2