docsify-docs-cn/docs/cover.md

102 lines
1.9 KiB
Markdown
Raw Permalink Normal View History

2018-07-01 07:27:01 -04:00
# 封面
通过设置 `coverpage` 参数,可以开启渲染封面的功能。具体用法见[配置项#coverpage](configuration.md#coverpage)。
## 基本用法
封面的生成同样是从 markdown 文件渲染来的。开启渲染封面功能后在文档根目录创建 `_coverpage.md` 文件。渲染效果如本文档。
_index.html_
```html
<!-- index.html -->
2018-07-01 07:27:01 -04:00
<script>
window.$docsify = {
coverpage: true
}
</script>
<script src="//cdn.jsdelivr.net/npm/docsify/lib/docsify.min.js"></script>
2018-07-01 07:27:01 -04:00
```
```markdown
<!-- _coverpage.md -->
2018-07-01 07:27:01 -04:00
![logo](_media/icon.svg)
# docsify <small>3.5</small>
2018-07-01 07:27:01 -04:00
> 一个神奇的文档网站生成器。
2018-07-01 07:27:01 -04:00
- 简单、轻便 (压缩后 ~21kB)
- 无需生成 html 文件
- 众多主题
2018-07-01 07:27:01 -04:00
[GitHub](https://github.com/docsifyjs/docsify/)
[Get Started](#docsify)
2018-07-01 07:27:01 -04:00
```
## 自定义背景
目前的背景是随机生成的渐变色,我们自定义背景色或者背景图。在文档末尾用添加图片的 Markdown 语法设置背景。
2018-11-05 18:51:22 -05:00
`_coverpage.md`
2018-07-01 07:27:01 -04:00
```markdown
<!-- _coverpage.md -->
# docsify <small>3.5</small>
2018-07-01 07:27:01 -04:00
[GitHub](https://github.com/docsifyjs/docsify/)
[Get Started](#quick-start)
<!-- 背景图片 -->
![](_media/bg.png)
<!-- 背景色 -->
![color](#f0f0f0)
```
## 封面作为首页
通常封面和首页是同时出现的,当然你也是当封面独立出来通过设置[onlyCover 选项](zh-cn/configuration.md#onlycover)。
## 多个封面
如果你的文档网站是多语言的,或许你需要设置多个封面。
例如你的文档目录结构如下
```text
.
└── docs
├── README.md
├── guide.md
├── _coverpage.md
└── zh-cn
├── README.md
└── guide.md
└── _coverpage.md
```
那么你可以这么配置
```js
window.$docsify = {
coverpage: ['/', '/zh-cn/']
};
```
2020-04-23 05:56:14 -04:00
或者指定具体的文件名
2018-07-01 07:27:01 -04:00
```js
window.$docsify = {
coverpage: {
'/': 'cover.md',
'/zh-cn/': 'cover.md'
}
};
```