查看“Docsify 封面”的源代码

= 封面 =

通过设置 <code>coverpage</code> 参数，可以开启渲染封面的功能。具体用法见[[configuration.md#coverpage|配置项#coverpage]]。

== 基本用法 ==

封面的生成同样是从 markdown 文件渲染来的。开启渲染封面功能后在文档根目录创建 <code>_coverpage.md</code> 文件。渲染效果如本文档。

''index.html''

<pre lang="html"><!-- index.html -->

<script>
  window.$docsify = {
    coverpage: true
  }
</script>
<script src="//cdn.jsdelivr.net/npm/docsify/lib/docsify.min.js"></script></pre>
<pre class="markdown">&lt;!-- _coverpage.md --&gt;

![logo](_media/icon.svg)

# docsify &lt;small&gt;3.5&lt;/small&gt;

&gt; 一个神奇的文档网站生成器。

- 简单、轻便 (压缩后 ~21kB)
- 无需生成 html 文件
- 众多主题

[GitHub](https://github.com/docsifyjs/docsify/)
[Get Started](#docsify)</pre>
== 自定义背景 ==

目前的背景是随机生成的渐变色，我们自定义背景色或者背景图。在文档末尾用添加图片的 Markdown 语法设置背景。

<code>_coverpage.md</code>

<pre class="markdown">&lt;!-- _coverpage.md --&gt;

# docsify &lt;small&gt;3.5&lt;/small&gt;

[GitHub](https://github.com/docsifyjs/docsify/)
[Get Started](#quick-start)

&lt;!-- 背景图片 --&gt;

![](_media/bg.png)

&lt;!-- 背景色 --&gt;

![color](#f0f0f0)</pre>
== 封面作为首页 ==

通常封面和首页是同时出现的，当然你也是当封面独立出来通过设置[[zh-cn/configuration.md#onlycover|onlyCover 选项]]。

== 多个封面 ==

如果你的文档网站是多语言的，或许你需要设置多个封面。

例如你的文档目录结构如下

<pre lang="text">.
└── docs
    ├── README.md
    ├── guide.md
    ├── _coverpage.md
    └── zh-cn
        ├── README.md
        └── guide.md
        └── _coverpage.md</pre>
那么你可以这么配置

<pre lang="js">window.$docsify = {
  coverpage: ['/', '/zh-cn/']
};</pre>
或者指定具体的文件名

<pre lang="js">window.$docsify = {
  coverpage: {
    '/': 'cover.md',
    '/zh-cn/': 'cover.md'
  }
};</pre>