如何为 Rmarkdown flexdashboard 上的框添加背景颜色

Question

我想为我的 flexdashboard 上的每个框涂上不同的颜色。例如，我希望框 1 内的背景为蓝色，框 2 内的背景为绿色，依此类推。

谁能告诉我这是否可行，如果可以，请问如何做到这一点？

我在下面附上了一段示例代码。

由于要输入的信息不止一条，我无法使用值框。

非常感谢，

title: "Example"
output: 
  flexdashboard::flex_dashboard:
  orientation: columns
  vertical_layout: fill
  ---

```{r setup, include=FALSE}
library(flexdashboard)
```

Column {data-width=450}
-----------------------------------------------------------------------

### Box 1

```{r}
x = 5
y =6 
```

In this example `r x` is smaller than `r y` 


### Box 2

```{r}
x = 5
y =6 
z= 4
```

In this example `r x` is smaller than `r y` but bigger than `r z`

Column {data-width=450}
-----------------------------------------------------------------------

### Box 3

```{r}

```

### Box 4

```{r}

```

Answer 1

您可以使用 CSS 为仪表板的所有元素设置样式。您的框会自动分配一个与其标题相对应的 ID（通常只是小写，空格被连字符替换）：

<style>
#box-1 {
  background-color: blue;
  color: white;
}
#box-2 {
  background-color: green;
}

此外，还可以将 CSS 类添加到您的盒子中，例如

## Box 1 { .first-box }

然后你可以改变这个类的样式使用

<style>
  .first-box {
    ...
  }
</style>