在 R Shiny 中更改 selectInput 的背景颜色

Question

我的示例代码：

library(shiny)

server <- function(input, output) {
}

ui <- fluidPage(
  br(),
  selectInput("select1", "Choose: ", c("Alt1.1", "Alt1.2"), selected = c("Alt1.1"), selectize = FALSE, multiple = TRUE),
  br(),
  selectInput("select2", "Choose: ", c("Alt2.1", "Alt2.2"), selected = c("Alt2.1"), selectize = FALSE, multiple = TRUE)
)

shinyApp(ui = ui, server = server)

我必须如何更改代码以使小部件的背景颜色为select1 的红色和select2 的蓝色？

编辑：

我试过了：

div(selectInput("select1", "Choose: ", c("Alt1.1", "Alt1.2"), selected = c("Alt1.1"), selectize = FALSE, multiple = TRUE), style = "background-color: red")

但这不是我要找的！相反，我希望选项的背景是红色的！

Answer 1

在下面的 cmets 中按要求进行了编辑

您可以通过样式标签添加CSS，如下所示：

library(shiny)

server <- function(input, output) {
}

ui <- fluidPage(
  br(),
  tags$style("#select1 {border: 2px solid #dd4b39;}"),
  selectInput("select1", "Choose: ", c("Alt1.1", "Alt1.2"), selected = c("Alt1.1"), selectize = FALSE, multiple = TRUE),
  br(),
  tags$style("#select2 {background-color:blue;}"),
  selectInput("select2", "Choose: ", c("Alt2.1", "Alt2.2"), selected = c("Alt2.1"), selectize = FALSE, multiple = TRUE)
)

shinyApp(ui = ui, server = server)

Answer 2

您可以将以下内容作为最后一个参数添加到您的fluidPage：

    tags$style(
        HTML('
                          #select1{
                          background-color: #ff0000;
                          }
                          #select2{
                          background-color: #0000ff;
                          }
                          '
        )
    )

这样您就可以将自定义 CSS 添加到您的应用中。将其传递给 fluidPage 应该可以完成小的更改，但如果您使用 CSS 调整大量元素，您可能会发现在应用程序的 www 目录中保存 .css 文件更容易。