浏览器会根据页面上使用的元素为网页列出一个大纲，在 chrome 商店里，你可以安装一个叫 html5 outliner 的扩展，它可以帮助我们了解一个网页大纲到底是什么样的 .. 你可以使用这个扩展来判断自己设计的网页的结构是不是自己想要的 ..

一个网页的结构最简单的方法就是使用标题元素来创建 .. 比如一张介绍如何学习 HTML 的网页，它上面可能会有一个大标题 .. 用一个 h1 添加一个最大级别的标题 .. 内容是 学习 HTML ..

再添加点介绍的文字 .. 下面再根据内容，又会划分成几个部分 .. 下一级别的标题是 h2 ... 这部分内容介绍一下学习 html 需要准备的一些工具 ..

然后再添加一个同一级别的标题 .. 介绍一下 html 这门语言 ... 最后再介绍一下 html 这门语言的基本的使用方法 ..

安装了 html5 outliner 这个扩展以后，在地址栏上会有一个这样的小标志 .. 点击它，会显示这个当前网页的大纲 .. 这里显示，网页是关于学习 HTML 的内容 .. 它下面又划分成了三个部分 .. 准备工具，理解语言，还有基本的语法 ...

在每部分内容的下面，又可以使用其它级别的标题去切分内容，比如在这个准备工具的下面，可以再用一个 h3 元素 .. 第三个级别的标题 .. 介绍一下具体要使用的工具 .. 比如先要准备 编辑器 ..

然后再添加一个 .. 再理解一下 npm 这个东西 .. 最后还要准备一下 git 这个工具 .. 再查看一下现在这个网页的结构 .. 这回在这个 准备工具 这部分内容里面，又分成了三个部分 .. 编辑器，npm 还有 git ..