Rmarkdown html报告中的DT数据表透明背景答案

【问题标题】：DT datatable transparent background in Rmarkdown html reportsRmarkdown html报告中的DT数据表透明背景
【发布时间】：2020-04-14 11:33:13
【问题描述】：

我的 html 输出 Rmarkdown 需要一个水印，但它被数据表掩盖了。

可能有一个简单的答案，但我还不知道 Javascript。有什么建议吗？

我尝试过使用 formatStyle，但它没有按预期工作：

datatable(mytable, escape = F, class = 'row-border hover compact') %>% 
  formatStyle(columns = names(mytable), backgroundColor = "#FFFFFF00")

我使用 style.css 获得水印：

.watermark {
  opacity: 0.2;
  position: fixed;
  top: 50%;
  left: 50%;
  font-size: 600%;
  color: #00407d;
}

以及完整的 Rmarkdown 示例：

---
title: "Untitled"
output:
  html_document: 
    highlight: pygments
    theme: "flatly"      # for: html_document black theme: darkly, white them: flatly
    toc: TRUE
    toc_float: TRUE       # for: html_document
    css: test-styles.css
---

<div class="watermark">DRAFT</div>

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

## Tables

```{r iris}

DT::datatable(iris, class = '') %>%
  DT::formatStyle(columns = "Species", backgroundColor = "#00000000") %>%
  DT::formatStyle(columns = "Petal.Width", backgroundColor = "#FFFFFFFFF")

DT::datatable(iris, class = '', options = list(
  initComplete = JS("
    function(settings, json) {
      $(this.api().table().body()).css({
        'background-color': 'rgba(255,0,0,0.2)',
        'color': 'rgba(0,255,0,0.8)'
      });
    }")))

```

## Including Plots

You can also embed plots, for example:

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

【问题讨论】：

标签： css r r-markdown dt

【解决方案1】：

将一个大的z-index 添加到您的watermark 类中：

.watermark {
  opacity: 0.2;
  position: fixed;
  top: 50%;
  left: 50%;
  font-size: 600%;
  color: #00407d;
  z-index: 1000000;
}

那就datatable(iris)吧，不用设置背景色。

【讨论】：