RMarkdown IO幻灯片演示文稿不再支持css文件中的背景图像

Question

创建具有图像背景的幻灯片 - 代码

就在几周前,我在创建RMarkdown文件时能够在RStudio中成功完成以下操作.

Rmarkdown文件(顶部YAML部分):

output:
  ioslides_presentation:
    css: ../css/slide_style.css
    logo: ../css/logos/approved.Logos.016.jpg
    self_contained: yes

然后,这将获取css文件slide_style.css,其中包含以下内容:

/* Below is the code to drop in a nice image for the background OUTSIDE of the slides. */
/* line 58, ../scss/default.scss */
/* line 236 of ../theme/../default.css */

body {
    background-image: url('../css/backgrounds/outside_slides.png');
}


/* Below is the code to drop in a nice image for the slide backgrounds, or "backdrop". */
/* line 170, ../scss/default.scss */
/* line 320 of ../theme/../default.css */

slides > slide.backdrop {
    background-image: url('../css/backgrounds/inside_slide.png');
}

这用于工作,其中inside_slide.png文件将作为背景图像嵌入(重复)在幻灯片本身内,并且outside_slides.png文件将类似地嵌入,但是围绕中央幻灯片的外边缘.

嵌入图像不再有效 - 我试过......

其余的css文件工作得很好.我有很好的效果,恕我直言,改变标题所在的位置,允许标题级别,更改表格的外观等等.所有这些仍然正常工作.图像本身没有被嵌入.明确,outside_slides.png并且inside_slides.png图像不再被生成的内再现.html文件.

检查文件路径......

所以,你可能会猜到文件本身就是问题所在.我检查了文件路径,一切都很好.事实上,我故意弄乱它,以确保它会失败.当路径错误时,它失败了.

打开文件本身......

也许这些文件没有我认为的文件？不,我可以使用预览或其他任何方式检查文件,它们看起来很好.我还指出了其他图像文件,这些文件也不能被视为背景.我试着用.png,.jpg和.gif.没运气.

确保css文件可以执行其他操作......

也许有些东西覆盖了这个身体标签？我尝试了一些简单的东西background-color: orange;,并且工作正常.我改变了不透明度,这很有效.我也尝试添加!important到css表.这没有用.(意思是,它适用于背景色,但不适用于背景图像.)

就好像有什么东西是过度的,这样background-image根本就行不通.

我一直在使用RStudio进行大部分测试.在RStudio中生成的演示文稿或.html通过Web浏览器打开的生成的演示文稿都不显示图像.

有没有人有任何想法发生了什么？

编辑

这是我的会话信息:

> sessionInfo()
R version 3.1.3 (2015-03-09)
Platform: x86_64-apple-darwin13.4.0 (64-bit)
Running under: OS X 10.10.4 (Yosemite)

locale:
[1] en_US.UTF-8/en_US.UTF-8/en_US.UTF-8/C/en_US.UTF-8/en_US.UTF-8

attached base packages:
[1] stats     graphics  grDevices utils     datasets  methods   base     

loaded via a namespace (and not attached):
[1] digest_0.6.8     htmltools_0.2.6  rmarkdown_0.7.3  rsconnect_0.3.79 tools_3.1.3      yaml_2.1.13     

Answer 1

既然你没有提供任何代码,我可以给你一个如何调试它的提示:在大多数浏览器中提供开发人员工具F12.现在

1. 单击放大镜图标以选择应具有该background-image组的元素
2. 打开"样式"选项卡以检查是否覆盖了某些内容background-image(将显示为删除文本)

也许你可以通过这种方式证明/反驳你的"压倒一切"假设.

祝好运!