RMarkdown with knitr to HTML：如何在 TOC（目录）中隐藏项目符号？答案

【问题标题】：RMarkdown with knitr to HTML: How to hide bullets in TOC (table of contents)?RMarkdown with knitr to HTML：如何在 TOC（目录）中隐藏项目符号？
【发布时间】：2015-03-24 04:15:33
【问题描述】：

如何在创建的 HTML 文件中隐藏目录项前面的项目符号？我只想看标题数字...

Test.Rmd 文件示例：

---
title: "Untitled"
author: "Author"
date: "01/25/2015"
output:
  html_document:
    number_sections: true
    toc: yes
    toc_depth: 3
---

*Content*

# Headline 1
## Sub headline 1.1
## Sub headline 1.2
### Sub sub headline 1.2.1
# Headline 2

生成的 HTML 文档的 TOC 将如下所示（带有不需要的项目符号 - 此处通过 * 字符表示）：

Untitled
Author

01/25/2015

* 1 Headline 1
  * 1.1 Sub headline 1.1
  * 1.2 Sub headline 1.2
    * 1.2.1 Sub sub headline 1.2.1
* 2 Headline 2
...

要点的原因是 knitr 与默认 HTML 模板一起使用的 li 标签。 创建的 HTML 代码如下所示：

<div id="TOC">
<ul>
<li><a href="#headline-1"><span class="toc-section-number">1</span> Headline 1</a><ul>
<li><a href="#sub-headline-1.1"><span class="toc-section-number">1.1</span> Sub headline 1.1</a></li>
<li><a href="#sub-headline-1.2"><span class="toc-section-number">1.2</span> Sub headline 1.2</a><ul>
<li><a href="#sub-sub-headline-1.2.1"><span class="toc-section-number">1.2.1</span> Sub sub headline 1.2.1</a></li>
</ul></li>
</ul></li>
<li><a href="#headline-2"><span class="toc-section-number">2</span> Headline 2</a></li>
</ul>
</div>

我阅读了一些关于 CSS 来抑制要点，但我不知道如何解决这个问题：

how to hide <li> bullets in navigation menu and footer links BUT show them for listing items

【问题讨论】：

标签： html r knitr r-markdown tableofcontents

【解决方案1】：

把这个放到styles.css:

div#TOC li {
    list-style:none;
    background-image:none;
    background-repeat:none;
    background-position:0;
}

然后在 Rmd 标头 YAML 中使用它：

---
title: "Untitled"
author: "Author"
date: "01/25/2015"
output:
  html_document:
    css: styles.css
    number_sections: true
    toc: yes
    toc_depth: 3
---

这将为您提供#，但没有•。注意：styles.css 和您的 Rmd 文件需要在同一目录中。

【讨论】：

按要求工作，谢谢！作为一个附加的愿望：我想避免额外的文件，但在 Rmd 文件中包含 CSS，以便所有内容（文本、图片和布局）都包含在一个文件中。我发现了如何使用你的styles.css 的内容（只需将styles.css 的内容复制到Rmd 文件本身，你就可以摆脱styles.css 文件）。我用这个解决方案发布了第二个答案

【解决方案2】：

如果您想避免在 HTML 文件之外添加额外的 (css) 文件，您可以将 CSS 代码直接放入您的 Rmd 文件中：

---
title: "Untitled"
author: "Author"
date: "01/25/2015"
output:
  html_document:
    number_sections: yes
    toc: yes
    toc_depth: 3
---

<style type="text/css">
div#TOC li {
    list-style:none;
    background-image:none;
    background-repeat:none;
    background-position:0; 
}
</style>
Your content starts here...

【讨论】：