在RStudio的bookdown中创建自定义块

Eri*_*een 9 css r rstudio bookdown

我正在尝试使用伟大的新包bookdown来使用RStudio中的RMarkdown创建一本gitbook风格的书.看到这里.

我的问题是关于创建自定义块.文档中有一个示例如何在CSS文件中定义块样式:

div.FOO {
  font-weight: bold;
  color: red;
} 
Run Code Online (Sandbox Code Playgroud)

作者给出了一些块可能看起来像的例子.

在此输入图像描述

AFAIK,没有关于如何使用图标定义此特定块的示例.我不太了解CSS,所以寻找我可以修改的东西.

我想使用像Leanpub这样的字体真棒图标来创建一些特殊的侧边栏.创建这样的东西的任何想法:

在此输入图像描述

我想我需要复制fontawesome目录,指定包含的fontawesome css文件的路径(在某处,不确定在哪里),并<i>在我的div定义中使用标记,例如<i class="fa fa-comment"></i>.关于如何实现这一点并不明确......或者它是否可行.

Eri*_*een 12

感谢@ Frank的提示(请参阅使用本地图像的解决方案),我能够提出以下建议.

style.css根据这个SO答案这个具体的例子将它添加到我书目录根目录中的文件中:

.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;
 }
Run Code Online (Sandbox Code Playgroud)

f075这个FontAwesome备忘单中获得了评论图标的值.

然后我从FontAwesome下载了CSS工具包,并将该font-awesome.min.css文件复制到我的book目录的根目录中.我将以下内容添加到我的output.yml文件中(在我开始使用的模板中,style.css, toc.css已经存在):

bookdown::html_book:
  css: [style.css, toc.css, font-awesome.min.css]
Run Code Online (Sandbox Code Playgroud)

最后,我使用以下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.
```
Run Code Online (Sandbox Code Playgroud)

在此输入图像描述