第1章与网页有关的基本概念.docx

第1章与网页有关的基本概念.docx

《第1章与网页有关的基本概念.docx》由会员分享，可在线阅读，更多相关《第1章与网页有关的基本概念.docx（16页珍藏版）》请在冰点文库上搜索。

第1章与网页有关的基本概念

第1章与网页有关的基本概念

网页（WebPage）看起来是一个很难懂的概念，极其抽象，看得见摸不着。

现代信息化的社会，无论是通过家庭个人用的电脑，还是公共场所的网吧，都可以在互联网上冲浪。

互联网上看到的就是网页，它是由若干种代码编写的文件形式，上面有图片、音乐、视频等丰富的资源。

在开始学习CSS布局之前，首先来了解一下网页的组成部分以及各部分的作用。

1.1网页的基本构成

网页就是在电脑的浏览器中呈现的一个个页面。

如果把一个网站比作一本书，那么网页就是这本书中的一页。

如图1-1所示就是用浏览器打开的一个普通的网页。

图1-1一个普通的网页

从网页的主要构成说起，一个标准的网页一般由4大部分组成：

内容、结构、表现和行为。

内容是网页中要传达的纯粹的信息，例如网页中所显示的文字、数据、图片等；结构是使用结构化的方法对网页中用到的信息进行整理和分类，使内容更具有条理性、逻辑性和易读性；表现是使用表现技术对已经被结构化的信息进行显示上的控制，例如版式、颜色和大小等样式的控制；行为就是网页的交互操作。

把如图1-1所示网页的4个基本组成部分分离，就得到4个层，如图1-2所示。

图1-2网页4个组成部分示意图

总之，网页的4个组成部分，可以形象一点的比喻为：

内容是人；结构是用来标明头、身体、四肢等各个部位；表现则是给各部位加上服装以打扮得漂亮；行为是四肢在特定环境下所呈现的交互行为。

1.2网页的结构设计——HTML与XHTML

用于网页的结构化设计语言有HTML、XHTML和XML等。

使用这样的语言代码，可以将网页的文字、图片或数据等信息进行分类、排版，最终显示给浏览者浏览。

本节主要介绍HTML、XHTML的基本概念及它们的区别。

1.2.1认识HTML

HTML（HyperTextMark-upLanguage）为超文本标记语言，是网页中的一个重要构成，主要负责将网页内容进行格式化，使内容更具逻辑性。

HTML是网页的基本描述语言，由TimBerners-Lee在1990年提出。

起初设计HTML语言的目的是为了能把存放在一台电脑中的文本或图形与另一台电脑中的文本或图形方便地联系在一起，形成有机的整体，人们不用考虑具体信息是在当前电脑上还是在网络的其他电脑上。

只要在某一文档中单击一个图标，Internet就会马上转到与此图标相关的内容上去，而这些信息可能存放在网络的另一台电脑中。

HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字、图形、动画、声音、表格、链接等。

HTML的结构包括头部（Head）和主体（Body）两大部分，头部描述浏览器所需的信息；主体包含所要说明的具体内容。

HTML是一种为普通文件中某些字句加上标记（Tag）的语言，其目的在于运用标记使文件达到预期的显示效果，例如下面的HTML代码。

这是HTML网页这里的文字是粗体

HTML文件看上去和一般文本类似，但是它比一般文本多了标记，例如、等，通过这些标记，可以告诉浏览器如何显示这个文件。

HTML不是C++和Java之类的程式语言，它只是标示语言，基本上只要明白了各种标记的用法便学懂了HTML。

HTML的格式非常简单，只是由文字及标记组合而成，在编辑方面，任何文字编辑器都可以，例如记事本，当然使用专业的网页编辑软件更好，例如AdobeDreamweaver等。

1.2.2认识XHTML

讲到XHTML，首先应该了解什么是XML，因为XHTML是基于XML的一种标准化结构语言。

下面来分别了解一下XML和XHTML的区别。

1．XML

XML是TheExtensibleMarkupLanguage（可扩展标记语言）的简写。

目前推荐遵循的是W3C于2000年10月6日发布的XML1.0。

和HTML一样，XML同样来源于SGML（一种早在Web发明之前就已经存在的定义电子文档结构和描述其内容的国际标准语言，是所有电子文档标记语言的起源），但XML是一种能定义其他语言的语言。

XML最初设计的目的是弥补HTML的不足，以强大的扩展性满足网络信息发布的需要，后来逐渐用于网络数据的转换和描述。

2．XHTML

XHTML是TheExtensibleHyperTextMarkupLanguage（可扩展超文本标记语言）的简写，是HTML的“升级规范”产品，其中“X”代表可扩展的，是单词“Extensible”的缩写。

实际上，XHTML也属于HTML家族，对比以前各个版本的HTML，它具有更严格的书写标准、更好的跨平台能力。

简单地说，XHTML就是更加严谨的HTML。

打个比方，如果说HTML是汉语，那么XHTML就是普通话。

2000年底，国际W3C组织（WorldWideWebConsortium）发布了XHTML1.0版本。

XHTML1.0是一种在HTML4.0基础上优化和改进的新语言。

XML虽然数据转换能力强大，完全可以替代HTML，但面对成千上万已有的站点，直接采用XML还为时过早。

因此，在HTML4.0的基础上，用XML的规则对其进行扩展，得到了XHTML。

简单地说，建立XHTML的目的就是实现HTML向XML的过渡。

1.2.3制作一个简单的XHTML网页

现在尝试着制作一个简单的使用XHTML编写的网页，这里可以先不用知道“<>”及里面的字母所代表的含义。

（1）在Windows系统中，启动记事本。

（2）在记事本中编写如下代码。

这是第一个XHTML网页

（3）单击菜单栏中的“文件”→“另存为”命令，把文件保存在电脑的某个位置，并将其命名为1_1.html。

图1-3XHTML的简单页面

（4）启动IE浏览器。

单击菜单栏中的“文件”→“打开”或“打开页面”命令，这时会弹出一个对话框。

单击“浏览”或“选择文件”按钮，找到刚才创建的文件“1_1.html”，选定它并单击“打开”按钮，将会看到对话框中有一行地址，例如“C:

\MyDocuments\1_1.html”。

单击“确定”按钮，浏览器就会显示这个页面，预览效果如图1-3所示。

在以上实例中，XHTML文件中的第一个标签是。

这个标签告诉浏览器这个HTML文件的开始点。

文件中最后一个标签是，这个标签告诉浏览器这是HTML文件的结束点。

位于标签和标签之间的文本是头信息，头信息不会显示于浏览器窗口中。