自定义CSS到rmarkdown块以更改图形的宽度

Question

我有一个rmarkdown文档，它输出html。我有自己的CSS样式，可以通过将其添加到YAML标头中来使用。我也想控制特定代码块的CSS。我有一个仪表盘（3x2的网格图），我希望其宽度大于主文档的宽度。我发现了以下两个问题：Add a CSS class to single code chunks in RMarkdownAdding custom CSS tags to an RMarkdown html document

但是他们俩都没有为我工作（或者我不明白答案）。我想更改图的宽度，使其浮动到边距中，例如宽度：110％。我试过了：

```{r dash1, fig.height=16, fig.width=14, results="asis"}
cat("
<style>
    .toc-content {
        width: 110%;
    }
</style>
")


margin = theme(plot.margin = unit(c(1,2,1,2), "cm"))

pl_1 <- list(g_1_kaupmattur, g_2_gallup, g_3_vnv, g_4_spa, g_5_ibud, g_6_swirlo)
grid.arrange(grobs = lapply(pl_1, "+", margin), ncol = 2)

```

这改变了整个文档，而不仅仅是这个特定块的输出。我还尝试使用width: 110%创建新的CSS样式并将其添加到块选项中，如下所示：

```{r dash1, fig.height=16, fig.width=14, class.source="dash_styles"}

margin = theme(plot.margin = unit(c(1,2,1,2), "cm"))

pl_1 <- list(g_1_kaupmattur, g_2_gallup, g_3_vnv, g_4_spa, g_5_ibud, g_6_swirlo)
grid.arrange(grobs = lapply(pl_1, "+", margin), ncol = 2)

```

也没有用。

我希望在下面的屏幕快照中“显示”时将图扩展到边距。

Answer 1

如果在YAML后面插入此CSS块，它将扩展所有（TOC）内容的边距（不仅是绘图）：

```{css toc-content, echo = FALSE}
.toc-content {
    padding-left: 0px;   # 30px is default value
    padding-right: 0px;  # 40px is default value
}
```

另外，您可能在zooming your plot(s)中很有趣。