新JSP动态网页基础教程 教学课件 张晓蕾 第2章 网页设计基础.ppt

第2章 网页设计基础 2.1 【案例2】诗词欣赏 2.1.1 HTML的基本概念 1．HTML概述 HTML（Hypertext Marked Language，超文本标记语言）是一种用来制作超文本文档的简单标记语言。HTML文档是由HTML元素组成的文本文件，它能独立于各种操作系统平台（如Linux，Windows等）进行浏览。 1990年以来，HTML就一直被用作WWW（World Wide Web，万维网）的信息表示语言，用于描述网页的格式设计和它与WWW上其他网页和文件的链接信息。使用HTML语言描述的文件，需要通过网页浏览器显示出效果。 HTML是一切网页实现的基础，在网络中浏览的网页都是一个个的HTML文件。这些网页中可以包含有文字、图片、动画和声音，还可以从当前文件跳转到另一个文件，与网络世界中各地主机上的文件相连接，故被称为超文本文件。 一个HTML文件通过一些特殊的标记来告诉浏览器应该如何显示文本、图像以及网页的背景，这些特殊的标记被称为HTML标记。例如，上一章中所见过的html、body、font等。表2-1中列出了常用的HTML语言标记。 下面是学习HTML标记的几点说明。 （1）所有HTML标记都是由“”号和“”号括住，标记名称不区分大小写。 例如：Html、html和HTML表示相同的意思。W3C（World Wide Web Consortium，万维网联盟）在HTML4建议中提倡使用小写标记。 （2）多数标记是成对出现的，一对标记的前面一个是起始标记，第二个是结束标记，在起始和结束标记之间的文本是元素内容。在起始标记的标记名称前加上符号“/”便是结束标记。 例如：html与/html、body与/body。 成对出现的标记可以嵌套使用，也就是标记里面还可以出现标记。例如： font color=red bJSP教程/b/font 上面的标记将使文本“JSP教程”用红色粗体文字显示。在嵌套时标记不要交叉，否则，会导致源文件的可读性差，且易出错。 （3）有少数标记单独出现，没有配对的结束标记。 例如：JSP动态语言教程br人民邮电出版社 上面语句中，br标记意味插入一个空行，在这里实际上就是换行，即将“JSP动态语言教程”和“人民邮电出版社”分成两行显示。 （4）部分标记可以拥有属性，以便为页面上的HTML元素提供附加信息。 注意，属性只可加于起始标记中，通常由属性名和取值成对出现。属性使用的格式如下： name=value 其中，name为属性名称，value为所设置的属性值。例如： body bgcolor=blue 这里标记body定义了HTML页面的主体元素，附加的bgcolor属性将告诉浏览器网页页面的背景颜色是什么，上面标记的意思是将网页页面的背景色设置为蓝色。 属性值通常被包含在双引号中，也可以使用单引号。在某些情况下——例如，属性值本身包含引号时，使用单引号是很有必要的。 （5）为了与其他标记相区别，HTML中规定了专门的标记来作为注释标记，注释标记用来在HTML源文件中插入注释。 注释在显示时被浏览器忽略，是不可见的。注释标记以“!--”开头，以“--”结束，如下所示： !-- 注 释 -- （6）很多标记都具有颜色属性，HTML中的颜色可以有两种表示方法：十六进制的RGB格式和在HTML中定义的颜色名称。 RGB格式的表示方式为“#RRGGBB”，其中每一个R、G、B都是一个0～F的十六进制数，分别表示红、绿、蓝三种颜色的深度，从00至FF颜色逐渐加深，00为无色透明，FF为纯色。 HTML中定义的颜色名称通常是一些常用颜色的英文单词，如red、black、green、blue、yellow等。例如： font color=#0000ffJSP教程/font font color=blueJSP教程/font 上面的两行代码均将文字“JSP教程”显示为蓝色。 2．HTML文件结构 HTML的文件结构很简单，其主体结构主要由以下三组标记构成： html/html head/head body/body html标记用以告知浏览器从这里开始是HTML文件，让浏览器认出并正确处理此HTML文件，整个HTML文件处于标记html与/html之间。 HTML的正式文档通常分两部分，位于head和/head标记之间的部分称为HTML文件头，位于body至/body标记之间的部分称为正文。文