我正在尝试使用伟大的新软件包
bookdown,在RStudio中使用RMarkdown创建一本gitbook风格的书.见
here.
我的问题是关于创建custom blocks.在文档中有一个示例如何在CSS文件中定义块样式：
- div.FOO {
- font-weight: bold;
- color: red;
- }
作者给出了一些块可能看起来像的例子.
AFAIK,没有关于如何使用图标定义此特定块的示例.我不太了解CSS,所以寻找我可以修改的东西.
我想像Leanpub一样使用font awesome icons创建一些特殊的侧边栏.创建这样的东西的任何想法：
我想我需要复制fontawesome目录,指定包含的fontawesome css文件的路径(某处,不知道在哪里),并使用< i>我的div定义中的标记,例如< i class =“fa fa-comment”>< / i>.关于如何实现这一点并不明确……或者它是否可行.
解决方法
感谢
@Frank’s tip(使用本地图像参见
his solution),我能够得到以下内容.
我将此添加到基于此SO answer和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文件复制到我的book目录的根目录中.我将以下内容添加到我的output.yml文件中(在我开始使用的模板中,style.css,toc.css已经存在)：
- bookdown::html_book:
- css: [style.css,toc.css,font-awesome.min.css]
- ```{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.
- ```
