问题

在一个Shiny应用中，我正在使用bslib库应用Yeti主题，并使用Bootstrap样式的数据表格。与使用其他Bootstrap样式（例如Bootstrap 5）或使用shinythemes库而不是bslib时不同，数据表格中出现了不希望的白色单元格边框，我无法去掉。

我尝试过进行CSS覆盖，但似乎没有起作用：

library(shiny)
library(DT)
library(bslib)

ui <- navbarPage("一个可复现的Shiny应用",
  theme = bs_theme(bootswatch = "yeti"),
  tabPanel("主页",
    tags$style('#mytable td {border: none;}'),
    mainPanel(DT::dataTableOutput('mytable'))
  )
)    

server <- function(input, output,session) {
  output$mytable = DT::renderDataTable(    
    datatable(mtcars[1:3], style="bootstrap")
  ) 
}

runApp(list(ui = ui, server = server))

[![带有恼人白色单元格边框的数据表格][1]][1]

这里是你要的翻译结果，不包括代码部分。

<details>
<summary>英文:</summary>

In a shiny app, I am applying the yeti theme using the bslib library and a datatable with bootstrap styling. Unlike as if using other bootstrap stylings (e.g. bootstrap5) or the shinythemes library instead of bslib, there are unwanted white cell borders in the datatable, which I don&#39;t manage to get rid of.

I tried to do a CSS override which did not seem to work:

library(shiny)
library(DT)
library(bslib)

ui <- navbarPage("A reproducible Shiny app",
theme = bs_theme(bootswatch = "yeti"),
tabPanel("MAIN",
tags$style('#mytable td {cell-border:0}'),
mainPanel(DT::dataTableOutput('mytable'))
)
)

server <- function(input, output,session) {
output$mytable = DT::renderDataTable(
datatable(mtcars[1:3], style="bootstrap")
)
}

runApp(list(ui = ui, server = server))

[![Datatable with annoying white cell borders][1]][1]


  [1]: https://i.stack.imgur.com/PHSIZ.png

</details>


# 答案1
**得分**: 1

你可以实际上自定义 `bs_theme()` 调用，使用 `bs_add_rules()` 并在其中传递一些 CSS 代码。

编辑：参见[此 GitHub 问题](https://github.com/rstudio/bslib/issues/360)和[bslib 文档](https://cran.r-project.org/web/packages/bslib/index.html)。

通过使用浏览器上的检查功能以及纯经验法，我发现 CSS 属性 `border-collapse` 是您正在寻找的属性，并且它与 `table.dataTable{}` 选择器相关联。描述 CSS 的工作原理超出了这个问题的范围，我不是专家，所以请随意在这个主题上进行了解。您还可以确实使用此表的特定选择器（所有其他数据表仍然具有白色边框）：`#mytable dt : {border-collapse: collapse !important;}`。

这是没有白色边框的您的应用程序：

```R
library(shiny)
library(DT)
library(bslib)

ui <- navbarPage("一个可重现的 Shiny 应用程序",
                 theme = bs_theme(bootswatch = "yeti") |
                   # 添加 CSS 规则以覆盖 yeti 的 'separate' border-collapse 默认选项：
                   bs_add_rules(".table.dataTable { border-collapse : collapse !important;}"),
                 tabPanel("主要",
                          mainPanel(DT::dataTableOutput('mytable'))
                 )
)

server <- function(input, output,session) {
  output$mytable = DT::renderDataTable(    
    datatable(mtcars[1:3], style="bootstrap")
  ) 
}

runApp(list(ui = ui, server = server))

希望这有所帮助。

library(shiny)
library(DT)
library(bslib)

ui <- navbarPage("A reproducible Shiny app",
                         theme = bs_theme(bootswatch = "yeti") |>
# add css rule to override yeti's 'separate' border-collapse default option :  
                   bs_add_rules(".table.dataTable { border-collapse : collapse !important;}"),
                         tabPanel("MAIN",

                                  # not needed anymore : tags$style('#mytable td {cell-border:0}'),
                                  mainPanel(DT::dataTableOutput('mytable'))
                         )
)

server <- function(input, output,session) {
  output$mytable = DT::renderDataTable(    
    datatable(mtcars[1:3], style="bootstrap")
  ) 
}

runApp(list(ui = ui, server = server))