我正在尝试将自定义 CSS 样式应用于闪亮应用程序中的 DT::datatable。当用户选择表中的一行时,我希望所选行为黄色、黑色文本,而不是默认的蓝色、白色文本。当我还使用 bslib 包时,我无法成功完成此操作。
(这里提出了类似的问题,但我无法回答,正如我将在下面描述的那样)。
没有bslib,我可以成功应用css,如下所示:
library(shiny)
ui <- fluidPage(
tags$head(
tags$style(
HTML("table.dataTable tbody tr.selected td {
color: black !important;
box-shadow: inset 0 0 0 9999px yellow !important;}"
)
)
),
DT::dataTableOutput("test_table")
)
server <- function(input, output, session) {
output$test_table <- DT::renderDataTable({
DT::datatable(iris, selection = 'single')
})
}
shinyApp(ui, server = server)
成功的CSS
但是,我发现使用 bslib 主题,我无法使用相同的方法来应用 css。
我已经看到这两个资源指向使用 bslib::bs_add_rules 函数来解决此问题:
基于这些,我尝试了以下变体,但似乎无法使其工作:
library(shiny)
ui <- bslib::page_fluid(
theme = bslib::bs_add_rules(
bslib::bs_theme(),
sass::as_sass("table.dataTable tbody tr.selected td {
color: black !important;
box-shadow: inset 0 0 0 9999px yellow !important;}"
)),
DT::dataTableOutput("test_table")
)
server <- function(input, output, session) {
output$test_table <- DT::renderDataTable({
DT::datatable(iris, selection = 'single')
})
}
shinyApp(ui, server = server)
不成功的CSS
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
问题出在对象标签上。如果您检查 HTML 代码,您会发现当您使用 sass::as_sass 时,它应该是 .table.dataTable tbody tr.active td ,而不是 table。 dataTable tbody tr.selected td
library(shiny) ui <- bslib::page_fluid( theme = bslib::bs_add_rules( bslib::bs_theme(), sass::as_sass("table.dataTable tbody tr.active td { color: black !important; box-shadow: inset 0 0 0 9999px yellow !important;}" )), DT::dataTableOutput("test_table") ) server <- function(input, output, session) { output$test_table <- DT::renderDataTable({ DT::datatable(iris, selection = 'single') }) } shinyApp(ui, server = server)