RMarkdown 与 knitr 到 HTML:如何隐藏 TOC 中的项目符号(table 的内容)?

RMarkdown with knitr to HTML: How to hide bullets in TOC (table of contents)?

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

示例 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

将其放入 styles.css:

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

然后在 Rmd header 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 文件需要在同一目录中。

如果您想避免在 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...