在 RStudio 的 bookdown 中创建自定义块

Question

我正在试用很棒的新软件包 bookdown to create a gitbook-style book using RMarkdown within RStudio. See here。

我的问题是关于创建 custom blocks。文档中有一个如何在 CSS 文件中定义块样式的示例：

div.FOO {
  font-weight: bold;
  color: red;
}

并且作者给出了一些块的示例。

AFAIK，没有示例说明如何使用图标定义此特定块。我对 CSS 了解不多，所以正在寻找我可以修改的内容。

我想使用 font awesome icons like Leanpub 来创建一些特殊的边栏。创建这样的东西的任何想法：

我想我需要复制 fontawesome 目录，指定包含的 fontawesome css 文件的路径（某处，不确定在哪里），并在我的 div 定义，例如 <i class="fa fa-comment"></i>。虽然不太清楚如何实现这个......或者它是否会起作用。

Answer 1

感谢 @Frank's tip (see his solution 使用本地图像），我能够想出以下内容。

我根据这个 SO answer and this specific example:

将它添加到我书目录根目录中的 style.css 文件中

.rmdcomment {
  padding: 1em 1em 1em 4em;
  margin-bottom: 10px;
  background: #f5f5f5;
  position:relative;
}

.rmdcomment:before {
    content: "\f075";
    font-family: FontAwesome;
    left:10px;
    position:absolute;
    top:0px;
    font-size: 45px;
 }

我从 this FontAwesome cheatsheet 获得了评论图标的值 f075。

然后我下载了 CSS toolkit from FontAwesome 并将 font-awesome.min.css 文件复制到我的书目录的根目录中。我将以下内容添加到我的 output.yml 文件中（在我开始使用的模板中，style.css, toc.css 已经存在）：

bookdown::html_book:
  css: [style.css, toc.css, font-awesome.min.css]

最后，我使用 type 选项将一个代码块插入到我的 Rmd 文件中：

```{block, type='rmdcomment'}
Some text for this block. Some text for this block. Some text for this block. Some text for this block. Some text for this block. Some text for this block.
```

在 RStudio 的 bookdown 中创建自定义块

creating custom blocks in RStudio's bookdown

css

r

rstudio

bookdown