2.3、文档浏览页

从`MrDoc`文集浏览阅读页面的大纲点击某一个文档的链接，会跳转到文档的浏览阅读页面，如下图所示：

![](/media//202004/mrdoc-doc_1586267334.png)

`MrDoc`的文集文档浏览阅读页面均是两栏式的布局，其中：

- 左侧为文集文档内容的边栏；
- 右侧为文集文档内容的主体；

## 左侧大纲

文集浏览阅读页面的左侧由三个部分组成：

1. 文集内容搜索框
2. 文集名称
3. 文集的文档大纲

### 文档大纲

左侧布局会显示文集下所有文档的层级关系，从而形成文集的文档大纲（或者称之为文档树）。`MrDoc`目前最多支持3级的文档，也就是能够作为上级文档的只能是第2级的文档了。

在文档浏览阅读页面，文档树默认只显示第1层级的文档以及当前文档所处的层级，同时文档大纲中的当前文档链接会显示成蓝色，以标识当前浏览阅读的文档在文集大纲中所处的位置。

你可以点击文档右侧的图标:fa-chevron-left: 来展开此层级的文档树，然后可以点击文档右侧的图标:fa-chevron-down: 来收起此层级的文档树。

### 搜索框

此处的搜索框不同于首页的搜索框，只能搜索本文集内文档的内容。搜索结果将在右侧布局中展现出来，如下图所示：

![](/media//202004/mrdoc-project-search_1586265878.png)

## 右侧内容主体

页面的右侧是文档的内容主体部分，其由以下3个部分组成：

1. 顶部控制栏
2. 中部内容栏
3. 底部分享栏

同时，还有两个悬浮的块：

下面我们一一进行介绍。

### 顶部控制栏

顶部的控制栏用于控制页面的布局以及进行额外的管理。无论访问此页面的用户是否登录，都会有以下几个图标按钮：

- :fa-align-justify: 用于收起和展开左侧大纲；
- :fa-text-height: 用于切换页面字体的类型（衬线体和非衬线体）
- :fa-font:-+ 用于跳转页面字体的大小

![](/media//202004/mrdoc-doc-close_1586267676.png)

### 中部内容栏

中部的内容栏将会自上而下显示文集的名称、文集的简介、文集下的文档大纲链接（可点击跳转到对应的文档）、文集的导出文件下载（需要文集的创建者在个人中心开放此文集的导出文件下载）

### 底部分享栏

最后的底部是社交分享栏，集成了常见的社交平台的分享按钮，方便用户将文集快速分享出去。

### 文档目录悬浮框

用于快速定位和跳转文档内各个标题、子标题，同时这个悬浮框还可以最小化、最大化和关闭。

### 返回顶部图标

当文档内容过多时，页面内容会很长，这个时候如果需要回到文档顶部，最好的方法就是点击“**返回顶部**”图标了。