如何在 ioslide 演示文稿中使用自定义 CSS 定位特定幻灯片？

Question

阅读this 介绍性文字，我认为将特定幻灯片上的正文或项目符号点着色为绿色很简单。我创建了自己的 css 文件，其中包含以下几行：

body p {
 font-size: 24px;
 font-family: Frutiger Light;
 color: orange;
}

li {
 font-family: Frutiger Light;
 font-size: 20px;
 color: green;
}

.change {
 color: green;
}

并通过将 {.change} 添加到 rmarkdown 文件中的标题来引用 css 类更改。然而，这完全被忽略了。我迷路了，非常感谢有关如何解决此问题的提示。

Here 是一个简单的可重现示例。请确保 css 与 rmd 位于同一文件夹中。

Answer 1

这真的取决于你到底想设计什么样式。 ioslides 使用<article> 管理每张幻灯片的“内容”**，id 带有幻灯片的名称。例如，如果您在 R Markdown 文件中这样做：

## Introduction

* Bullet 1
* Bullet 2

这将（在knit 之后）呈现为类似于：

<hgroup> <h2>Introduction</h2> </hgroup>
<article  id="introduction">
<ul>
  <li>Bullet 1</li>
  <li>Bullet 2</li>
</ul>
</article>

这意味着您可以像这样使用 .css 来定位该幻灯片上的 <li> 项目符号 - 非常愚蠢的示例，但您会立即查看是否正确（here 上的正确文档）：

#introduction ul li {
    font-size: 50px;
}

** 我含糊地说了那里的内容，因为整个<slide> 的管理是通过诸如“current”之类的类来完成的，它是可变的，使得定位特定幻灯片变得更加困难

编辑：如果你真的想要，你也可以直接在 .Rmd 中包含 css，使用上面的例子，你可以在你的 .Rmd 中做：

<style type="text/css">
#introduction ul li {
  font-size: 50px;
} 
</style>

## Introduction

* Bullet 1
* Bullet 2