[第2章WEB程序设计的基础.ppt

第2章 WEB程序设计的基础 本章学习目标 本章主要讲解HTML语言、CSS和x HTML语言。通过本章学习，读者应该掌握以下内容： ????????? HTML语言基本知识 ????????? Css ????????? X HTML语言基础知识 2.1 HTML语言 2.1.1 HTML 语言的结构 HTML（超文本标记语言）是一种描述文档结构的标注语言，它使用一些约定的标记对WWW上的各种信息进行标注。当用户浏览WWW上的信息时，浏览器会自动解释这些标记的含义，并按照一定的格式在屏幕上显示这些被标记的文件。HTML的优点是其跨平台性。即任何可以运行浏览器的计算机都能阅读并显示HTML文件，不管其操作系统是什么，并且显示结果相同。 HTML文件是标准的ASCII文件，且其后缀名为htm或html的文件。HTML文件看起来像是加入了许多被称为链接签（tag）的特殊字符串的普通文本文件。从结构上讲，HTML文件由元素（element）组成，组成HTML文件的元素有许多种，用于组织文件的内容和指导文件的输出格式。绝大多数元素是“容器”， 即它有起始标记和结尾标记。元素的起始标记叫做起始链接签（start tag），元素结束标记叫做结尾链接签（end tag），在起始链接签和结尾链接签中间的部分是元素体。每一个元素都有名称和许多可选择的属性，元素的名称和属性都在起始链接签内标明。下面来看一个HTML文件，它在浏览器中显示的结果如图2-1所示。 HTML HEAD TITLE湖北工业大学/TITLE /HEAD BODY bgcolor= yellow P这是一HTML的测试文件/P /BODY /HTML 从上例中我们可以看出，HTML文件仅由一个HTML元素组成， 即文件以HTML开始，以/HTML结尾，文件其余部分都是 HTML的元素体。而HTML元素的元素体又由头元素head…/head、体元素body…/body和一些注释组成。头元素和体元素的元素体又由其它的元素、文本及注释组成。 在上例中第五行是体元素的起始链接签，它标明体元素从此开始。因为所有的链接签都具有相同的结构，所以应该仔细分析这个链接签的各个部分，以便读者对链接签的写法有一个大概的了解。其格式为： 起始链接签 属性名＝属性值 内容 结束链接签 在HTML中有三个字符具有特殊的意义，即：（表示一个标签的开始），（表示一个标签的结束），和（表示转义序列的开始）。每个转义字符都以“”开始，以分号“；”结束。nbsp; 元素名也叫链接签名。需要注意的是： （1） 和起始链接签之间不能有空格。 （2）元素名称不区分大小写。 （3）一个元素可以有多个属性，属性及其属性值不区分大小写，且各个属性用空格分开。 HTML文件中，有些元素只能出现在头元素中，而绝大多数元素只能出现在体元素中。在头元素中的元素表示的是该HTML文件的一般信息，比如文件名称，是否可检索等等。这些元素书写的次序是无关紧要的，它只表明该HTML有还是没有该属性。与此相反，出现在体元素中的元素是次序敏感的，改变元素在HTML文件中的次序会改变该HTML文件的输出形式。 2.1.2 构成网页的基本元素 下面介绍一下常用的有关Web页文本格式的标记。 1. TITLE标记 TITLE标记用来给网页命名，网页的名称写在TITLE与/TITLE标记之间，显示在浏览器的标题栏中。例如，在图2-1中所示的浏览器页面中，其标题栏所显示的“湖北工业大学”是在HTML文件中的由TITLE湖北工业大学/TITLE所定义的。 2. Hn标记 H1…/H1到H6…/H6标题元素有6种，用于表示文章中的各种题目。字体大小H1到H6顺序减小。下面这个例子中分别使用了H1到H6的标题。其HTML文件如下所示，在浏览器中的显示效果如图2-2所示。 HTML HEAD TITLE这是一个测试网页/TITLE /HEAD BODY h1标题测试/h1 h2标题测试/h2 h3标题测试/h3 h4标题测试/h4 h5标题测试/h5 h6标题测试/h6 /BODY /HTML 3. 预格式化文本标记pre HTML的输出是基于窗口的，因而HTML文件在输出时都是要重新排版的，即把文本上任何额外的字符（如空格、制表符和回车符）都忽略，若确实不需要重新排版的内容，可以用pre…／pre通知浏览器。在图2-3和图2-4中显示了有无预格式化文本标记pre的对比。 下面是图2-3和图2-4的HTML源文件。 HTML HEAD TITLE这是一个测试网页/TITLE /HEAD BODY pre !--（图2-4无此标记）-- HTML是一种描述文档结构的标注语 言，