在图形/代码块 (HTML) 上方和下方添加垂直空间

Question

我正在将 RStudio 中的 Rmd 文件编织成 HTML，我想增加正文和表格/图形之间的空间。 Here's a nice solution 用于 PDF 输出。 CSS 的哪一部分在 HTML 输出中指定了这个间距？我正在寻找一个模板范围的解决方案，而不是手册 <br>。

---
title: "Example"
output: 
  bookdown::html_document2:
    fig_captions: yes
    number_sections: false
    theme: cerulean
    highlight: tango
    toc: true
    code_download: true
    code_folding: "show"
    toc_float: true
---

<style type="text/css">

body{ /* Normal  */
      font-size: 18px;
      font-family: Helvetica;
  }

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

```{r setup, include=FALSE}
library(ggplot2)
library(knitr)
```

## Section

Here is some text before a table.

```{r cars}
kable(head(cars))
```

Here is some text after the table. Here comes a plot. Could use more space after the table and before the plot.

```{r pressure, echo=FALSE, fig.align="center", fig.cap="My caption", message=FALSE, warning=FALSE}
ggplot(cars, aes(speed)) +
  geom_histogram()
```

Here is some text after the plot. Need some space between the figure caption and the body text.

Answer 1

添加

.figure {
   margin-top: 100px;
   margin-bottom: 100px;
}

table {
    margin-top: 100px;
    margin-bottom: 100px !important;
}

在<style> 标签内。显然调整到需要的量。