Skip to content

Commit ba36efc

Browse files
committed
docs(cn): add section for custom page class
1 parent 125550c commit ba36efc

File tree

1 file changed

+20
-0
lines changed

1 file changed

+20
-0
lines changed

docs/zh/default-theme-config/README.md

+20
Original file line numberDiff line numberDiff line change
@@ -302,6 +302,26 @@ $borderColor = #eaecef
302302
$codeBgColor = #282c34
303303
```
304304

305+
## 自定义页面类
306+
307+
有时候你可能需要为特定页面添加一个 CSS 类名,以方便针对该页面添加一些专门的 CSS。这种情况下你可以在该页面的 YAML front matter 中声明一个 `pageClass`
308+
309+
``` yaml
310+
---
311+
pageClass: custom-page-class
312+
---
313+
```
314+
315+
然后你就可以写专门针对该页面的 CSS 了:
316+
317+
``` css
318+
/* .vuepress/override.styl */
319+
320+
.theme-container.custom-page-class {
321+
/* 特定页面的 CSS */
322+
}
323+
```
324+
305325
## 特定页面的自定义布局
306326

307327
默认情况下,每个 `*.md` 文件将会被渲染在一个 `<div class="page">` 容器中,同时还有侧边栏、自动生成的编辑链接,以及上 / 下一篇文章的链接。如果你想要使用一个完全自定义的组件来代替当前的页面(而只保留导航栏),你可以再次使用 `YAML front matter` 来指定这个组件。

0 commit comments

Comments
 (0)