Css 在R标记演示文稿中覆盖reveal.js

Css 在R标记演示文稿中覆盖reveal.js,css,r,rstudio,r-markdown,reveal.js,Css,R,Rstudio,R Markdown,Reveal.js,我正在尝试合并一个reveal js演示文稿,但在覆盖默认css主题时遇到了问题。我想从绘图图像中删除边框。根据文件规定,这应适用于: 但事实并非如此,我想这是因为这种覆盖并没有更具体。但我的问题是,我常用的增加特异性的方法也不起作用: ## Slide with Plot <section class = "no-border"> ```{r pressure} plot(pressure) ``` </section> 这就是css覆盖: section.no-b

我正在尝试合并一个reveal js演示文稿,但在覆盖默认css主题时遇到了问题。我想从绘图图像中删除边框。根据文件规定,这应适用于:

但事实并非如此,我想这是因为这种覆盖并没有更具体。但我的问题是,我常用的增加特异性的方法也不起作用:

## Slide with Plot
<section class = "no-border">
```{r pressure}
plot(pressure)
```
</section>
这就是css覆盖:

section.no-border > img {
  background:none; 
  border:none; 
  box-shadow:none;
 }

有人知道我做错了什么吗

问题似乎是,您的
标记没有缠绕在源代码及其输出上。您可以使用jQuery:

---
title: "Title"
author: "..."
output:
  revealjs::revealjs_presentation:
    incremental: true
    includes:
      css: slidyStandard.css
---

<!-- Include jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

<!-- Add class to img elements -->
<script type="text/javascript">
$(document).ready(function() {
  $elms = $('p > img');
  $elms.addClass('no-border');
});
</script>

<!-- define no-border class -->
<style>
.no-border {
  border: 0px !important;
}
</style>

```{r pressure}
plot(pressure)
```
---
标题:“标题”
作者:“…”
输出:
revealjs::revealjs_演示文稿:
增量:正确
包括:
css:slideststandard.css
---
$(文档).ready(函数(){
$elms=$('p>img');
$elms.addClass(“无边界”);
});
没有边界{
边界:0px!重要;
}
```{r压力}
绘图(压力)
```

我意识到我将自定义css放在了YAML标题的错误位置。因此,它不起作用

以下是自定义css的可复制代码:

---
title: "Untitled"
output: 
  revealjs::revealjs_presentation:
    css: custom2.css
---

## R Markdown

This is an R Markdown presentation. Markdown is a simple formatting syntax for authoring HTML, PDF, and MS Word documents. For more details on using R Markdown see <http://rmarkdown.rstudio.com>.

When you click the **Knit** button a document will be generated that includes both content as well as the output of any embedded R code chunks within the document.

## Slide with Bullets

- Bullet 1
- Bullet 2
- Bullet 3

## Slide with R Code and Output

```{r}
summary(cars)
```

## Slide with Plot

```{r, echo=FALSE}
plot(cars)
```

你确定YAML中的缩进是正确的吗?您是否尝试添加
!重要的
到您的CSS类吗?@MartinSchmelzer我希望如此,没有错误,但这并不意味着任何ofc,也添加了它。编辑:尝试!重要的是,没有成功。为了完整性,您也可以为
添加CSS样式。无边框(无边框)我应该将其添加到标题(标题:)还是正文(正文:)之前?您可以将其添加到YAML块的正后和第一张幻灯片之前。好的-谢谢!它被插入到html中,但似乎没有执行,因为img标记是未更改的。这很奇怪。我添加了一张图片,向您展示我得到的结果。我还添加了Rmd的全部内容。情节周围的黑色大边框消失了(留下了一些阴影)。是的-很奇怪,但错误似乎出现在我的完整演示中,因为我让你的代码也工作了。。。可能是覆盖覆盖的内容…:)谢谢!
---
title: "Untitled"
output: 
  revealjs::revealjs_presentation:
    css: custom2.css
---

## R Markdown

This is an R Markdown presentation. Markdown is a simple formatting syntax for authoring HTML, PDF, and MS Word documents. For more details on using R Markdown see <http://rmarkdown.rstudio.com>.

When you click the **Knit** button a document will be generated that includes both content as well as the output of any embedded R code chunks within the document.

## Slide with Bullets

- Bullet 1
- Bullet 2
- Bullet 3

## Slide with R Code and Output

```{r}
summary(cars)
```

## Slide with Plot

```{r, echo=FALSE}
plot(cars)
```
.reveal section img {
  margin: 15px 0px;
  background: rgba(255, 255, 255, 0.12);
  border: none;
  box-shadow: none; 
  }