Question

我用谷歌搜索了一下，但我似乎无法找到RMarkdown-CSS参考的“完整”参考。

我找到了以下（和有用的）资源：

但我真的找不到所有可自定义元素的完整参考。

例如，我想更改幻灯片背景颜色，标题颜色和数字格式。我设法通过读取HTML输出（使用浏览器检查器）来设置前者的CSS属性（背景和标题 - 标题btw-）但我真的无法弄清楚我要做什么来设置幻灯片数字的样式。

以下是一个小例子：

---
title: "The title"
author: "Zamengo Bruno"
date: '`r format(Sys.Date(), "%d/%m/%Y")`'
output: 
  ioslides_presentation: 
    css: styles.css
    widescreen: yes
    theme: yeti
---

```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = FALSE)
```

## First slide 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce tempor neque ac euismod ornare. Cras scelerisque ante velit, volutpat rhoncus massa vehicula vitae. Donec viverra tincidunt velit id egestas. Quisque a aliquam quam. Phasellus lorem lectus, imperdiet ut libero a, vulputate lobortis arcu. Sed consequat fringilla nulla sed tempor. Proin laoreet massa sed vestibulum tristique. Nulla non volutpat arcu, a semper arcu. Etiam lobortis augue in felis commodo condimentum. Quisque interdum sed lorem in varius. Sed at massa quis ipsum semper vestibulum pharetra vel nisl. 

## Second one 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce tempor neque ac euismod ornare. Cras scelerisque ante velit, volutpat rhoncus massa vehicula vitae. Donec viverra tincidunt velit id egestas. Quisque a aliquam quam. Phasellus lorem lectus, imperdiet ut libero a, vulputate lobortis arcu. Sed consequat fringilla nulla sed tempor. Proin laoreet massa sed vestibulum tristique. Nulla non volutpat arcu, a semper arcu. Etiam lobortis augue in felis commodo condimentum. Quisque interdum sed lorem in varius. Sed at massa quis ipsum semper vestibulum pharetra vel nisl.

这是（非常非常简单）CSS文件styles.css：

slide {
    background-color: #E0E9E3;
}

h1, h2, h3, h4, h5, h6, h7, h8 {
    color: #99CC00;
}

最后一个问题：

如何将幻灯片编号设为绿色？

更普遍的是

是否有任何完整的引用RMarkdown ioslides HTML标记，可以通过CSS设置样式？

Answer 1

回答你的第一个问题：

\label{table:name}

关于第二个或我是如何得出第一个问题的答案：

本身没有参考。这里的问题是幻灯片编号的外观被定义为pseudo class（例如<style> slides > slide:not(.nobackground):after { color: green; } </style>）：

如果单击该行，则会找到该伪元素的相应样式：

您可以清楚地识别属性:after中幻灯片编号的定义。因此，这个CSS不会影响幻灯片元素，而是影响下面的空间＆＃34;它。只需复制并粘贴CSS选择器，然后添加或编辑所需的样式。

在这种情况下，如果我无法通过树木看到森林，我通常会检查可以在github找到的默认样式表。如果你content Ctrl + F（知道它可能被定义为这样）或只是:after，你会发现相应的代码行非常快。

Answer 2

我找不到适合于ioslide（或RMarkdown）的教程。尽管如此，here is还是一个不错的，友好的，非常实用的教程，介绍了一般如何编写自己的CSS。

有没有RMarkdown“ioslides-CSS”参考指南？

2 个答案: