文档结构图怎么设置出来?

HTML文档，也称为网页，包括两部分:页眉和正文。表头主要描述浏览器和搜索引擎需要的信息，浏览器不会将这些信息呈现给访问者；它是主文档的主体，是网页中真正要传达的信息，将在浏览器窗口的主体部分呈现给访问者。

HTML总是以标签开始和结束。之间的内容...标签是头信息，而内容在...标签是主体部分，也就是文档的主体。另外，在文档的开头，声明这是一个HTML文档。如图116所示:

图116 html文档结构

HTML文档由4个基本部分组成:

(1)文件声明:

②一个html标签对:

③头部标签对:

④一对身体标签:

1.1.1

声明必须是HTML文档的第一行，在标记之前。这个声明不是一个HTML标记，而是一个DTD类型，它告诉浏览器HTML文档。

在HTML5之前，DTD有很多种类型，即过渡型、严格型和框架集型。然而，不同的类型对文档标签的严格性有不同的要求，并且它们的书写方法非常复杂。估计没人能完全记住这些写法，给开发带来了混乱。

HTML5之后，一切都简化了，只要声明一下，它就会告诉浏览器这个文档是HTML5文档。

1.1.2 HTML根元素

html文档的根元素是HTML元素，从标签开始，到标签结束。根元素的作用是告诉浏览器，和之间的内容是HTML类型的，浏览器会根据HTML解析内容。

Html元素有两个属性，即lang属性和manifest属性:

Lang属性指定用于页面内容的默认语言。指定文档中使用的语言有助于语言合成工具选择发音语言，或翻译工具选择翻译规则。例如，表示该文档是中文的。

Manifest属性给出脱机缓存文件的URL。HTML5引入了应用程序缓存，这意味着web应用程序可以被缓存和脱机访问。例如，指示脱机缓存文件是waibo.manifest

HTML标题

head元素用于定义文档的标题信息。之间出现的内容...标签是文档的标题信息。页眉中定义的内容不会显示在浏览器窗口的正文中。

Head元素比较特殊，标签中只允许放置一些特定的标签，它们是、、、、、

上面的代码表明这个HTML文档的背景色是黄色，这个HTML文档中所有段落的文本颜色是蓝色。

脚本

在HTML文档中，Javascript脚本可以用来定义特殊的行为，但Javascript不是必需的。

在大多数情况下，Javascript是在HTML和CSS构建的核心体验的基础上提升访问者的体验。主要用于增强页面的交互性，比如实现表单验证、动态显示隐藏内容、加载数据和动态更新页面、操作音视频元素控件等等。

在HTML文档中，有两个元素用于标识脚本。它们是script元素和noscript元素:

1.脚本元素

script元素可以将Javascript脚本直接嵌入到页面中，或者从外部文件加载脚本。

嵌入式脚本

就是直接在script元素中编写Javascript代码。比如:

HTML文档也支持多个脚本元素。这样定义的脚本只对本文档有效，脚本代码需要放在HTML文件中，而不是脚本文件中。脚本通常分散在很多地方，不方便维护，容易出错。因此，不推荐这种方法。

加载外部脚本

通过script元素的src属性指定外部脚本文件的URL，可以将外部脚本加载到这个HTML文档中。URL可以是绝对路径或相对路径。相对路径相对于此HTML文档。

在HTML文档中，可以添加多个脚本元素来指向不同的脚本文件，并且可以为一个网页加载多个脚本文件。加载外部脚本时，script元素必须是空元素，也就是说，开始和结束标记之间不能有任何内容。比如:

上面的代码表明文档将加载一个外部脚本。脚本文件的名称是engine.js，脚本文件与这个HTML文档位于同一个目录中。

这是引入脚本的最佳方式。多个页面可以加载相同的脚本文件。此外，脚本存储在一个单独的文件中。当需要修改脚本时，只需要编辑一个文件，而不用更新每个页面中的相似脚本，维护起来极其方便。

2.noscript元素

Noscript元素是一个检测工具。当检测到脚本中的脚本内容无法执行时，即浏览器不支持Javascript或用户禁用Javascript时，将显示noscript元素中的文本。比如:

您的浏览器不支持Javascript

注意:

默认情况下，浏览器将按照脚本在HTML中出现的顺序依次下载、解析和执行每个脚本。

在处理脚本的过程中，浏览器既不会下载也不会呈现出现在脚本元素之后的内容，这就是所谓的阻塞行为。

该规则对嵌入式脚本和外部脚本都有效。可以想象，阻塞行为会影响页面的渲染速度，影响程度取决于脚本的大小及其执行的动作。

所以建议在页面末尾加载脚本，也就是尽量把脚本元素放在而不是head元素的前面。

标签用于定义文档的正文内容，并且成对出现。之间的内容...是页面的主要内容，可以是文本、图像、音频、视频、表单等交互内容。它们才是真正应该显示在浏览器中并被访问者看到的内容。

由于HTML元素可以相互嵌套，所以千变万化的网页是由元素一层一层嵌套而成的。当一个元素包含另一个元素时，外部元素称为父元素，内部元素称为子元素。子元素也可以包含子元素，子元素中包含的任何元素都是外部父元素的后代。比如:

在上面的代码中，article元素是h1，P，P的父元素，而h1，P，P是article元素的子元素。元素p是em和a元素的父元素。Em和A元素是P元素的子元素和article元素的后代。Article元素是em和A元素的祖先。

应该注意，当一个元素包含其他元素时，每个元素必须正确嵌套。这些元素的开始标签和结束标签是成对的，不允许相互交叉。比如: