在 Rmarkdown 中使用 HTML 文档在左侧添加目录答案

【问题标题】：Adding a table of contents on the left side with HTML document in Rmarkdown在 Rmarkdown 中使用 HTML 文档在左侧添加目录
【发布时间】：2017-10-06 21:30:18
【问题描述】：

我试图在 Rmarkdown 生成的 HTML 文档中添加目录。首先，我找到了this answer，这似乎是一个简单的方法，在 HTML 文件中添加一个带有这段代码的 CSS 文件：

#TOC {
  position: fixed;
  left: 0;
  top: 0;
  width: 200px;
  height: 100%;
  overflow:auto;
}
body {
  max-width: 800px;
  margin: auto;
  margin-left:210px;
  line-height: 20px;
}

但我想修改 Rmarkdown 中的 CSS。解决我找到this other post的问题，如何添加自定义CSS标签。但这并不是我想要的，也不知道如何以正确的方式将其与答案混合。

我的代码如下所示：

---
title: "R"
output: html_document
toc: yes
runtime: shiny
---

```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = TRUE)
```
```{r results="asis"}
cat("TOC {
  position: fixed;
  left: 0;
  top: 0;
  width: 200px;
  height: 100%;
  overflow:auto;
}
body {
  max-width: 800px;
  margin: auto;
  margin-left:210px;
  line-height: 20px;
}")
```

我想我错过了一些重要的事情。提前致谢！

【问题讨论】：

标签： html css r knitr r-markdown

【解决方案1】：

如first answer 的代码所示，您需要在 YAML 标头中添加这些，但需要注意空格：

title: "cssTest"
    output:
    html_document:
      css: custom.css
      toc: yes

那么，css 文件应该是一个外部 css 文件。超出您的 Rmd 代码。在这里，它是与您的 Rmd 文件在同一目录中的文件，称为custom.css。

【讨论】：

那么，不能从Rmarkdown修改.css吗？
我不知道。你可以尝试cat 和file = custom.css。这可以作为 knit 在运行 Pandoc for HTML 代码之前首先运行 R 代码...

【解决方案2】：

Hmisc 包非常简单，只需将以下内容添加到您的启动块并运行它即可。它将呈现在 html 中：

hidingTOC(
buttonLabel = "Contents",
levels = 3,
tocSide = c("right", "left"),
buttonSide = c("right", "left"),
posCollapse = c("margin", "top", "bottom"),
hidden = FALSE
)

tocSide 指定您希望 TOC 位于哪一侧。如需更具体的文档，请点击此处：https://cran.r-project.org/web/packages/Hmisc/Hmisc.pdf

【讨论】：