'###' 在 flexdashboard/rmarkdown 中添加了什么 HTML？答案

【问题标题】：What HTML does '###' add in flexdashboard/rmarkdown?'###' 在 flexdashboard/rmarkdown 中添加了什么 HTML？
【发布时间】：2017-08-12 04:58:31
【问题描述】：

我有一个 flexdashboard，其中不同的部分由标题 ### 分隔，例如：

page 1
===================================== 

Column
-----------------------------------------------------------------------

### section 1

bla bla bla        

### Section 2

```{r}
# r data 
```
> Source: me!

我更改了 CSS 以包含我的公司颜色，但我想添加两种不同的颜色。例如：第 1 部分为红色，第 2 部分为蓝色。所以我创建了一个新类并重写了原来的.chart-title 标签。

这仅适用于第一种，某种适用于第二种。我使用 Chrome 进行了一些检查，并尝试像纯 HTML 一样以这种格式添加它：

<div class="chart-title-2">Section 2</div>
<div class="chart-stage">
<p>BLA BLA BLA</p>
</div>

这出现在第一部分中。我尝试在新部分之前添加结束</div>，这将部分和列的顺序固定起来。

我想知道在 HTML 中添加的“###”标题具体是什么，以便我可以复制它以坚持不同的 CSS。或者有没有更简单的方法来做到这一点？

【问题讨论】：

不会 rmarkdown 被翻译成 HTML，以便您可以在浏览器中轻松查看确切的输出是什么？ SO-markdown 将### test 变成<h3>test</h3>。

标签： html css r r-markdown flexdashboard

【解决方案1】：

三个破折号 (###) 在 HTML 中呈现为 <h3> 标记。通过使用“纯”Markdown，您将无法向其中添加任何类/ID，因此我建议通过显式访问元素本身来直接格式化h3 标签，例如：

CSS

h3 {
  color: Teal;
}

h3:first-of-type {
  color: Tomato;
}

希望对你有帮助！

【讨论】：